title: multiple assertions in a single statement in cypress
body: <p>I am trying to assert visibility of the child elements in a parent element.</p>
  
  <p>i am checking weather the divs inside c-cost-with label are visible.</p>
  
  <p>Here is the HTML for it:</p>
  
  <p><a href="https://i.stack.imgur.com/PEAkM.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/PEAkM.png" alt="HTML Content"></a></p>
  
  <p>i am trying to fetch the elements based on the parent:</p>
  
  <pre><code>    Given(/^I should see the following charge amounts and charge labels in offer:$/, (dataTable) =&gt; {
      dataTable.rawTable.slice(1).forEach((row) =&gt; {
          let [optionName, pricingPlanName, chargeAmount, ChargeLabel] = row;
          let costWithLabelElement = costWithLabelUtil.getCostWithLabelElement(optionsCardCostListElement);
          costWithLabelUtil.getCostWithLabelCostElementContainingText(chargeAmount, costWithLabelElement).should('be.visible');
          costWithLabelUtil.getCostWithLabelLabelElementContainingText(ChargeLabel, costWithLabelElement).should('be.visible');
  
      });
  });
  </code></pre>
  
  <p>here is the code in costWithLabelUtil:</p>
  
  <pre><code>    export function getCostWithLabelElement (ancestorElement = null) {
      return ElementFinders.getElementFromAncestorIfProvided('.c-cost-with-label', ancestorElement);
  }
  
  
  export function getCostWithLabelMainElement (ancestorElement = null) {
      return ElementFinders.getElementFromAncestorIfProvided('.c-cost-with-label__main', ancestorElement);
  }
  
  
  export function getCostWithLabelCostElement (ancestorElement = null) {
      return ElementFinders.getElementFromAncestorIfProvided('.c-cost-with-label__cost', ancestorElement);
  }
  
  export function getCostWithLabelCostElementContainingText (text, ancestorElement = null) {
      return ElementFinders.getElementContainingTextFromAncestorIfProvided('.c-cost-with-label__cost', text, ancestorElement);
  }
  
  export function getCostWithLabelLabelElement (ancestorElement = null) {
      return ElementFinders.getElementFromAncestorIfProvided('.c-cost-with-label__label', ancestorElement);
  }
  
  export function getCostWithLabelLabelElementContainingText (text, ancestorElement = null) {
      cy.log(ancestorElement);
      return ElementFinders.getElementContainingTextFromAncestorIfProvided('.c-cost-with-label__label', text, ancestorElement);
  }
  </code></pre>
  
  <p>Here is the Element Finder page:</p>
  
  <pre><code>    export function getElementFromAncestorIfProvided (elementLocator, ancestorElement = null) {
      if (ancestorElement) {
          return ancestorElement.find(elementLocator);
      }
  
      return cy.get(elementLocator);
  }
  
  
  export function getElementContainingTextFromAncestorIfProvided (elementLocator, text, ancestorElement = null) {
      if (ancestorElement) {
          return ancestorElement.find(elementLocator).contains(text);
      }
  
      return cy.get(elementLocator).contains(text);
  }
  </code></pre>
  
  <p>I am fetching the parent element first and then trying to fetch the childs and check there visibility.</p>
  
  <p>when i execute the steps the first step is executed correctly but the second step is failing !!!</p>
  
  <p><a href="https://i.stack.imgur.com/uZnBf.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/uZnBf.png" alt="Fail"></a></p>
  
  <p>it is trying to fetch the element from '.c-cost-with-label__cost' even though in the function i am passing the parent element.</p>
  
  <p>how to resolve this issue, how to perform assertions [check visibility] on different elements simultaneously </p>