javascript - 带有 promise 的 Protractor 变量范围

Question

背景

我正在开发一个使用 ng-repeat 制作表格的 Angular 应用程序。其中一位用户发现该表有时包含重复条目，我目视确认了这一点，然后立即为此编写了 Protractor 测试。

测试

变量作用域问题

在编写测试时，我注意到示波器没有按照我理解的方式运行。

当然，第 61 行的 for 循环可以访问 linkStorage(第 38 行)，因为它在更高的范围内。它记录了所有对象都已通过第 47 行的 promise 中的 for 循环成功添加到对象。

但是，当我将确认循环移到 promise 之外时，比如说，在 expect block 之前...

...linkStorage 是一个空对象。

遍历对象没有发现嵌套的键值对；它真的是空的。

问题(tl;dr)

为什么 linkStorage 对象填充在 then 语句中，而不是在预期之前？

Answer 1

异步再次来袭

第一个例子的工作是由于异步。因为 .getAttribute 方法是非阻塞的，代码在它工作时会继续运行。因此，在填充对象之前到达控制台循环；它是空的。

如果您给异步代码一些时间来运行，也许一秒钟:

...linkStorage 已填充。

完整的解决方案

将多个 promise 链接在一起以确保代码在正确的时间运行。

it('should not have duplicates within the match grid', function() {
    // Already on job A, with match grid shown.
    var duplicate = false;
    var linkStorage = {};

    // Save unique links
    var uniqueUserLinks = element.all(by.css('div.row table tbody tr td a'));
    
    // get an array of href attributes
    uniqueUserLinks.getAttribute('href')
      .then(function(hrefs) {
        // add the links to the linkStorage object
        for (var i = 0; i < hrefs.length; i++) {
          // if the link is already there
          if( linkStorage[ hrefs[i] ] ) {
            // update its counter
            linkStorage[hrefs[i]] += 1
            duplicate = true;
            // there's already one duplicate, which will fail the test
            break;
          } else {
            // create a link and start a counter
            linkStorage[hrefs[i]] = 1;
          }
        };
      }).then(function() {
        // confirm links have been added to storage
        for(var link in linkStorage) {
          console.log('link:', link );
          console.log('number:', linkStorage[link] );
        }
      }).then(function() {
          expect(duplicate).toBe(false);
      });
  });