Skip to content

Instantly share code, notes, and snippets.

@mjhenkes

mjhenkes/a.now.js

Last active January 25, 2023 16:58
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save mjhenkes/1bf01beb9082a322511ecaf208b1ffe0 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save mjhenkes/1bf01beb9082a322511ecaf208b1ffe0 to your computer and use it in GitHub Desktop.
Download ZIP
Command queue confusion
Raw
readme.md

Command queue confusion

This example attempts to demonstrate some confusing situations users may encounter based on the current async await proposal.

In each example I also list out the command queue and the execution order of the each statement.

  • now.js demonstrates how are things currently.

  • withProposedAwait.js demonstrates how things would be with the new proposed await

  • awaitAllTheThings.js demonstrates how things would change if we required all cypress commands to be awaited.

I know there are also query vs assertion / retry-ability concerns in here to but these examples focus on execution order.

Largely my concern is that the intersection of the command queue and the await command will be too confusing for users to reason about without significant knowledge of how the command queue works.

I think requiring awaiting all the cy commands would actually resolve that, but i think that runs into retry-ability problems.

Raw
a.now.js
it('does stuff', async () => {
cy.firstCyCommand() //Enqueue
cy.secondCyCommand() //enqueue
const val = await firstFunction() // Awaits firstFunction promise
cy.thirdCyCommand() //enqueue
secondFunction() // runs
// Run command queue.
})
/* command queue
firstCyCommand
secondCyCommand
last thing
(end)
*/
/* execution order
enqueue firstCyCommand
enqueue secondCyCommand
firstFunction
enqueue thirdCyCommand
secondFunction
execute firstCyCommand <-- command queue always runs enqueue commands after evaluating the test.
execute secondCyCommand
execute thirdCyCommand
*/
Raw
b.withProposedAwait.js
it('does stuff', async () => {
cy.firstCyCommand() // enqueue
await cy.secondCyCommand() // enqueue
// Run command queue
const val = await firstFunction() // Awaits firstFunction promise
cy.thirdCyCommand() // enqueue
secondFunction() // runs
// Run command queue.
})
/* command queue
firstCyCommand
secondCyCommand
(end)
thirdCyCommand
(end again)
*/
/* execution order
enqueue firstCyCommand
enqueue secondCyCommand
execute firstCyCommand <-- Why did this get executed first when it wasn't awaited
execute secondCyCommand
firstFunction
enqueue thirdCyCommand
secondFunction
execute thirdCyCommand <-- Given that firstCyCommand executed synchronously without needing an await, Why did 'thirdCyCommand' execute after 'secondFunction'
*/
Raw
c.awaitAllTheThings.js
it('does stuff', async () => {
await cy.firstCyCommand() // enqueue
// Run command queue.
await cy.secondCyCommand() // enqueue
// Run command queue.
const val = await firstFunction() // Awaits firstFunction promise
await cy.thirdCyCommand() // enqueue
secondFunction() // runs
// Run command queue.
})
/* command queue
firstCyCommand
(end)
secondCyCommand
(end)
thirdCyCommand
(end again)
*/
/* execution order
enqueue firstCyCommand
execute firstCyCommand
enqueue secondCyCommand
execute secondCyCommand
firstFunction
enqueue thirdCyCommand
execute thirdCyCommand
secondFunction
*/
@BlueWinds
Copy link

BlueWinds commented Jan 25, 2023 •
edited
Loading

Let me try and address why I'm not concerned about these confusions.

execute thirdCyCommand <-- Given that firstCyCommand executed synchronously without needing an await, Why did 'thirdCyCommand' execute after 'secondFunction'

Let's replace the example with promises.

it('does stuff', async () => {
  let a = firstPromise()
  let b = a.then(() => secondPromise())
  await b

  const val = await firstFunction() // Awaits firstFunction promise

  b.then(() => thirdPromise())

  secondFunction()
})

/* execution order
enqueue firstPromise
.then secondPromise
execute firstPromise  <-- Why did this get executed first when it wasn't awaited
execute secondPromise
firstFunction
enqueue thirdPromise
secondFunction
execute thirdPromise <-- Given that firstPromise executed synchronously without needing an await, Why did 'thirdPromise' execute after 'secondFunction'
*/

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment