How to use webContents.debugger.sendCommand method in Cypress

The commented answer above was the clue I needed, but it needs a couple tweaks (at least as of the version I'm using: v3.1.5). The link has all the info, but the answer should be as follows

cy.type('{selectall}')

Note that it's ".type()" instead of ".text()" and the escape sequence is quoted...

Two assertions seem appropriate to run in this instance - existence and typeof.

// property exists
expect(response).to.have.property(key)
// or
expect(response).to.have.property('id')

// property has type
expect(typeof response[key]).to.eq('string')  // whatever type it is
// or
expect(typeof response.id).to.eq('number')

It turns out that Electron browser silently fails at executing newer syntax like Promises, that's why code in resolved Promise's then() callback which was supposed to change display property of .thz-items-loading and #btn-submit was never executed and tests expecting that change never passed.

Adding babel's polyfills before main.js of tested APP fixed this issue:

<script src="../../node_modules/@babel/polyfill/dist/polyfill.min.js"></script> <!-- or copy to root dir in build process -->
<script src="./main.js"></script>

As far as I know, no --- it's not required when you run Cypress from a binary.

Cypress runs on Electron, which bundles Node.js in.

As for cy.task etc., it communicates with Cypress' own background node.js process (from Electron), not one that would be supplied by host (your) environment.

this can be done more easily than that : in your cypress.json add

"env": {
   "YourVarName":"YourVarValue"
}

And in your code you can access to your var with :

const myGolabalVar = Cypress.env("YourVarName")

That's all you need

You can move the eq() into the selector with :nth(1), which will cause the indexing to be part of the cy.get() retry mechanism

cy.get('[data-test="textarea"]:nth(1)')
  .type('Hello').type('{enter}')

Or you can assert the length of the elements selected before indexing the list.

cy.get('[data-test="textarea"]')
  .should('have.length', 2)
  .eq(1)
  .type('Hello').type('{enter}')

Demo

/// <reference types="@cypress/fiddle" />

const waitForAdd = {
  html: `
    <div id="parent">
      <textarea data-test="textarea">1</textarea>
      <button data-test="insert-item" onclick = "myFunction()"></button>
    </div>
    <script>
      const myFunction = () => {
        setTimeout(() => {
          const parent = document.querySelector('div#parent');
          let ta = document.createElement("textarea");
          ta.setAttribute('data-test', 'textarea');
          parent.appendChild(ta);
        }, 500)
      }
    </script>
  `,
  test: `
    cy.get('[data-test="insert-item"]').click();
    cy.get('[data-test="textarea"]:nth(1)')
      .type('Hello').type('{enter}')
    cy.get('[data-test="textarea"]:nth(1)')
      .invoke('val')
      .should('eq', 'Hello\\n')

    cy.get('[data-test="insert-item"]').click();
    cy.get('[data-test="textarea"]')
      .should('have.length', 3)
      .eq(2)
      .type('Hello again').type('{enter}')
    cy.get('[data-test="textarea"]')
      .eq(2)
      .invoke('val')
      .should('eq', 'Hello again\\n')
`
}
it('tests hello', () => {
  cy.runExample(waitForAdd)
})

You can specify which .collapse you want by the content of it's children

cy.contains('.collapse', 'Apple')  // gets the 1st collapse element where child has "Apple" text
  .find('item').eq(1)             // within that, get the 2nd <item>
  .should('have.text', 'Apple 2')

If your actual HTML is more complicated and you want to start with the title element,

cy.contains('.title', 'Apple')  // get the title child with "Apple" text
  .parent()                    // move up to div.collapse
  .find('item').eq(1)         // within that, get the 2nd <item>
  .should('have.text', 'Apple 2')

or siblings navigation

cy.contains('.title', 'Apple')  // get the tile child with "Apple" text
  .siblings('item').eq(1)       // 2nd item sibling
  .should('have.text', 'Apple 2')

The only way I can see to reliably test the loader is to intercept and delay the response.

See intercept - StaticResponseObject which has a delay option to simulate a slow network, which is the scenario where the user sees the loader.

{
  /**
   * Serve a fixture as the response body.
   */
  fixture?: string
  /**
   * Serve a static string/JSON object as the response body.
   */
  body?: string | object | object[]
  /**
   * HTTP headers to accompany the response.
   * @default {}
   */
  headers?: { [key: string]: string }
  /**
   * The HTTP status code to send.
   * @default 200
   */
  statusCode?: number
  /**
   * If 'forceNetworkError' is truthy, Cypress will destroy the browser connection
   * and send no response. Useful for simulating a server that is not reachable.
   * Must not be set in combination with other options.
   */
  forceNetworkError?: boolean
  /**
   * Milliseconds to delay before the response is sent.
   */
  delay?: number
  /**
   * Kilobits per second to send 'body'.
   */
  throttleKbps?: number
}

There is the oneOf assertion if an exact match is is acceptable.

cy.get('element')
  .should('satisfy', ($el) => {
    expect($el.text()).to.be.oneOf([value1,value2])
  })
  .click()