量角器 - 打开浏览器，等待，运行测试

Question

我正在学习量角器，它看起来很棒。但是我想在单个页面上运行几个规格。我怎样才能做到这一点？我的问题是，我的页面上有很多东西通过ajax加载，有些是通过级联加载的。

目前，我使用wait和beforeEach来运行规格。代码如下：

const br = browser; 
const url = 'http://localhost:3000'; 

br.ignoreSynchronization = true; 


describe('Component',() => { 
    beforeEach(() => { br.get(url); }); 

    it ('should be present',() => { 
     expect(element(by.className('news-list__wrapper')).isPresent()).toBe(true); 
    }); 

    it ('should render children',() => { 
     br.wait(() => { 
      return element(by.className('news-block')).isPresent(); 
     }, 2500).then((r) => { if (r) { console.log('\n ✓ Component renders children') } }); 
    }); 

    it ('should render images',() => { 
     br.wait(() => { 
      return element.all(by.className('news-block__img')).first().isPresent(); 
     }, 2500).then((r) => { if (r) { console.log('\n ✓ Component renders images') } }); 
    }); 

    it ('should load images',() => { 
     br.wait(() => { 
      return element(by.className('news-block__image--loaded')).isPresent(); 
     }, 2500).then((r) => { if (r) { console.log('\n ✓ Component loads images') } }); 
    }) 
}) 

我该怎么办？

Answer 1

在此使用ExpectedConditions在browser.wait()这样的AJAX calls- 有关详细信息，您可以参阅API文档 - http://www.protractortest.org/#/api?view=ProtractorExpectedConditions

const br = browser; 
const url = 'http://localhost:3000'; 
const EC = protractor.ExpectedConditions; 

br.ignoreSynchronization = true; 


describe('Component',() => { 
beforeEach(() => { br.get(url); }); 

it ('should be present',() => { 
    expect(element(by.className('news-list__wrapper')).isPresent()).toBe(true); 
}); 

it ('should render children',() => { 
    br.wait(EC.presenceOf(element(by.className('news-block'))), 2500).then((r) => { if (r) { console.log('\n ✓ Component renders children') } }); 
}); 

it ('should render images',() => { 
    br.wait(EC.presenceOf(element.all(by.className('news-block__img')).first()), 2500).then((r) => { if (r) { console.log('\n ✓ Component renders images') } }); 
}); 

it ('should load images',() => { 
    br.wait(EC.presenceOf(element(by.className('news-block__image--loaded'))), 2500).then((r) => { if (r) { console.log('\n ✓ Component loads images') } }); 
}) 
}) 

Answer 2

设置browser.ignoreSynchronization = false和使用browser.waitForAngular()，使你的脚本等待所有Ajax调用来获得完成。量角器的威力在于它会等待页面所做的所有异步调用完成，然后才会执行下一行代码。