asynchronous - Working with multiple chainer results in cypress

Question

Since Cypress can't easily use async/await, in order to use multiple chained values, right now I'm doing this:

const getScrubPosition = () => cy.getState().its('meta').its('scrubPosition');

const getScrollBar = () => cy.getByTestId('SCROLL_BAR').then(([bar]) => bar);

const getGutter = () => cy.getByTestId('GUTTER').then(([bar]) => bar);

// my workaround
const getScrubScrollGutter = () => getScrubPosition().then(initialPos =>
  getScrollBar().then(([bar]) =>
     getGutter().then(([gutter]) =>
       ({ initialPos, bar, gutter }))));

it('is ridiculous', () => {
  getScrubPosition().then(initialPos => {
    getScrollBarWidth().then(initialWidth => {
      getScrollContainerWidth().then(containerWidth => {
        // do something with initialPos, initialWidth, and containerWidth
      });
    });
  });

it('>90 frames, with current series', () => {
  clickSeries(1, 3); // x2x4, 94 frames, including pending
  getScrubScrollGutter().then(({ initialPos, bar, gutter }) => {
    expectPendingShown(true);
    expectScrollBar();

    // the bar shouldn't be wider than the gutter
    expect(bar.offsetWidth).to.be.lessThan(gutter.offsetWidth);

    // the right of the bar should be aligned with the right of the gutter
    expect(rightEdgeOf(bar)).to.equal(rightEdgeOf(gutter));
    debugger

    // the bar shouldn't be to the left of the gutter
    expect(bar.offsetLeft).to.be.greaterThan(gutter.offsetLeft);
  });

There MUST be a better way to do this, right? The github issue mentioned above talks about things like

cy.get('something')
  .then(x => doSomethingTo(x))
  .then(y => console.log('please help'))

etc. But I'm having a hard time understanding it -- or, if I do understand it, it doesn't actually pass all the values along to the further contexts (i.e., I don't think you can use x in the third line of what I just wrote.)

What about Promise.all?

Yes, I tried that. Please only give a Promise.all related answer if you have actually been able to use it in Cypress.

Thanks.

标签： asynchronouscypress