美元符号 ( $ ) 在 Cypress 中的变量之前做什么（在 then 子句中）

Question

在 the Cypress documentation for Variables and Aliases 中，它在 then 子句中的变量前使用美元符号。像这样：

cy.get('button').then(($btn) => {
  // $btn is the object that the previous
  // command yielded us
})

但是我想不通为什么。

有 many other 个帖子简单地说了一堆关于“这只是另一个角色”的东西，所以没什么特别的。显然，还有一堆提到 jQuery。

我刚刚有一个复杂的赛普拉斯命令的例子，它没有用，因为我没有美元符号。这是我的代码：

命令

Cypress.Commands.add( "verifyUsersAccessToArticle", ( articleFixture, userType ) => {
  cy.fixture( articleFixture, "utf8" ).as( 'article' );

  // Intercept async-loaded content XHR
  cy.get( "@article" ).then( ($article) => {
    cy.intercept({
      method: 'GET',
      url: '/wp-json/sn/public/v1/article/' + $article.postId,
    }).as('postContentFull');
  });

  // Log in
  cy.visit( Cypress.env( 'baseUrl' ) );
  if( userType !== 'noUser' ){
    cy.loginUser( userType );
  }

  // Go to article
  cy.get( "@article" ).then( ($article) => {
    cy.visit( Cypress.env( 'baseUrl' ) + $article.url );
  });

  // Let content load
  cy.wait( 1000 );
  if( userType !== 'noUser' ){
    cy.userIsLoggedIn();
  }

  cy.get( "@article" ).then( ($article) => {

    // Have access
    if( $article[ userType ].hasAccess ){
      cy.get( '@postContentFull' ).then( ( $postContentFull ) => {
        expect( $postContentFull.response.statusCode ).to.equal( 200 );
        cy.get( '#main .post-content' ).children().its( 'length' ).should( 'be.gte', 4 ); // 4 <p>'s
        cy.get('.react-pay-product-paywall').should( 'not.exist' );
      });
    }

    // Doesn't have access
    if( ! $article[ userType ].hasAccess ){
      cy.get( '@postContentFull' ).then( ( $postContentFull ) => {
        expect( $postContentFull.response.statusCode ).to.equal( 402 );
        cy.get( '#main .post-content' ).children().its( 'length' ).should( 'be.lte', 4 ); // 4 <p>'s
        cy.get('.react-pay-title').contains( $article[ userType ].paywallTitle );
        cy.get('.react-pay-card-price > span').contains( $article[ userType ].paywallPrice );
      });
    }
  });
});

测试

it( 'Verify users access to article', () => {
  
  let articles = [
  'foo-article',
  'bar-article'
  ];

  articles.forEach( (article) => {
    cy.verifyUsersAccessToArticle( Cypress.env( 'name' ) + '/' + article, 'subscriptionTypeZero' );
  });

});

如果我写 postContentFull 而不是 $postContentFull，那么我会在第二个运行上遇到错误（当运行是 bar-article):

- then      function(){} 
TypeError 

Cannot read properties of undefined (reading 'statusCode')

总体问题

那个美元符号有什么作用？
我是不是瞎了 - 或者为什么我在 Cypress 文档中找不到它？

更新 1：我可能误解了什么

我想我有一个古怪的测试 - 并且错误地认为美元符号是解决方案。但我很确定这仅仅是因为 @article （被拦截）在执行 cy.get( "@article" ).then( ($article) => { 时尚未解决。

当我添加美元符号时，服务器返回速度更快。

我还是想弄明白，美元符号是干什么的。 :-)

Answer 1

同上评论，但更多信息 -

你应该wait拦截，而不是get。

cy.get('@postContentFull') 将只有在拦截已经拦截的情况下才有效。

此外，由于您为每篇文章构建了一个新的截取，因此别名必须是唯一的（否则您无法确定获得的是哪个截取）。

cy.fixture( articleFixture, "utf8" )
  .then(article => {                // convention: no $ here, since it's not jQuery

    const alias = 'postContentFull' + article.postId
    cy.intercept('/wp-json/sn/public/v1/article/' + article.postId)
      .as(alias)

    cy.visit('/');                 // visit baseUrl
    if(userType !== 'noUser') {
      cy.loginUser(userType);
    }

    cy.visit(article.url);         // Cypress prepends baseUrl

    cy.wait('@' + alias).then(() => {

      if(article[userType].hasAccess) {
        ...
      } else {
        ...
      }

    })
  })

美元符号 ( $ ) 在 Cypress 中的变量之前做什么（在 then 子句中）

What do the dollar-sign ( $ ) do before variables in Cypress (in then clauses)

cypress

cypress-intercept

更新 1：我可能误解了什么