How can I imlement soft Assertion in my Cypress test - automated-tests

Question

I am struggling with implementing soft assertions in my Cypress test.
I need to convert all the assertions to soft assertions. The problem I encounter is that I cannot locate the element in the jsonAssertion. For example cy.get('span[class="h4"]') is the element and I need to assert that it contains some text. How can this be done with jsonAssertion.softAssert()?
This is my test:
describe('Load Validation Test', function(){
const jsonAssertion = require("soft-assert")
it('Load Validation Test', function(){
let url = Cypress.config().baseUrl
cy.visit(url+'activityTaskManagement')
cy.get('span[class="h4"]').should('contain.text','Manage Activities')
cy.get('button[ng-click="vm.addActivityTask();"]').should('be.visible')
cy.get('button[ng-click="vm.addActivityTaskBulk();"]').should('be.visible')
cy.get('input[placeholder="Activity Name"]').should('be.visible')
cy.get('div table[class="table table-striped b-t b-light table-nowrap"]').should('be.visible')
})
})

Answer 1

For soft-assert, see How can i use soft assertion in Cypress
As custom commands,
const jsonAssertion = require("soft-assert")
Cypress.Commands.add('softAssert', (actual, expected, message) => {
jsonAssertion.softAssert(actual, expected, message)
if (jsonAssertion.jsonDiffArray.length) {
jsonAssertion.jsonDiffArray.forEach(diff => {
const log = Cypress.log({
name: 'Soft assertion error',
displayName: 'softAssert',
message: diff.error.message
})
})
}
});
Cypress.Commands.add('softAssertAll', () => jsonAssertion.softAssertAll())
In the test
cy.get('span[class="h4"]').then($el=> {
const actual = $el.text()
cy.softAssert(actual, 'Manage Activities')
})

Answer 2

There's also package that proxies expect
const { proxy, flush } = require("#alfonso-presa/soft-assert");
const { expect } = require("chai");
const softExpect = proxy(expect);
cy.get('span[class="h4"]')
.invoke('text')
.should(actual => {
softExpect(actual).to.eq('Manage Activities')
})
flush() // Now fail the test if above fails
})

Answer 3

If you just want to assert that the element span[class="h4"] has some text you can do:
cy.get('span[class="h4"]').should('include.text','Manage Activities')
Using soft assert you can do something like this:
const jsonAssertion = require('soft-assert')
describe('Load Validation Test', function () {
it('Load Validation Test', function () {
let url = Cypress.config().baseUrl
cy.visit(url + 'activityTaskManagement')
cy.get('span[class="h4"]')
.invoke(text)
.then((text) => {
jsonAssertion.softContains(
text,
'Manage Activities',
'Some custom message'
)
})
cy.get('button[ng-click="vm.addActivityTask();"]').should('be.visible')
cy.get('button[ng-click="vm.addActivityTaskBulk();"]').should('be.visible')
cy.get('input[placeholder="Activity Name"]').should('be.visible')
cy.get(
'div table[class="table table-striped b-t b-light table-nowrap"]'
).should('be.visible')
})
})