Question

我在做什么

编辑：我创建了一个repo，其中包含问题的简化版本，从而再现了问题。

我正在尝试使用browserstack，selenium-webdriver和tape来设置自动化的前端测试。

More about tape

这个想法是要定义多个浏览器和设备，这些浏览器和设备必须使用X项给定的测试进行一个又一个的测试。在下面的示例中，我在OSX上仅定义了一个测试和两个浏览器。

为了只定义浏览器并处理测试，我创建了一个仓库test-runner，应该将其作为dev-dependency添加到仓库中，需要在给定的设备和浏览器上进行测试。 test-runner通过所有必需的测试，启动第一个浏览器，在该浏览器上运行测试，完成所有测试后，浏览器关闭quit()，下一个浏览器启动并再次测试。

测试运行器

/index.js

const webdriver = require( 'selenium-webdriver' )

// ---
// default browser configs
// ---
const defaults = {
  "os" : "OS X",
  "os_version" : "Mojave",
  "resolution" : "1024x768",
  "browserstack.user" : "username",
  "browserstack.key" : "key",
  "browserstack.console": "errors",
  "browserstack.local" : "true",
  "project" : "element"
}

// ---
// browsers to test
// ---
const browsers = [
  {
    "browserName" : "Chrome",
    "browser_version" : "41.0"
  },
  {
    "browserName" : "Safari",
    "browser_version" : "10.0",
    "os_version" : "Sierra"
  }
]

module.exports = ( tests, url ) => {

  // ---
  // Asynchronous forEach loop
  // helper function
  // ---
  async function asyncForEach(array, callback) {
    for (let index = 0; index < array.length; index++) {
      await callback(array[index], index, array)
    }
  }

  // ---
  // runner
  // ---
  const run = async () => {

    // ---
    // Iterate through all browsers and run the tests on them
    // ---
    await asyncForEach( browsers, async ( b ) => {

      // ---
      // Merge default configs with current browser
      // ---
      const capabilities = Object.assign( {}, defaults, b )

      // ---
      // Start and connect to remote browser
      // ---
      console.info( '-- Starting remote browser hang on --', capabilities.browserName )
      const browser = await new webdriver.Builder().
        usingServer( 'http://hub-cloud.browserstack.com/wd/hub' ).
        withCapabilities( capabilities ).
        build()

      // ---
      // Navigate to page which needs to be checked (url)
      // ---
      console.log('-- Navigate to URL --')
      await browser.get( url )

      // ---
      // Run the tests asynchronously
      // ---
      console.log( '-- Run tests --- ' )
      await asyncForEach( tests, async ( test ) => {
        await test( browser, url, capabilities, webdriver )
      } )

      // ---
      // Quit the remote browser when all tests for this browser are done
      // and move on to next browser
      // Important: if the browser is quit before the tests are done
      // the test will throw an error beacause there is no connection
      //  anymore to the browser session
      // ---
      browser.quit()

    } )

  }

  // ---
  // Start the tests
  // ---
  run()

}

如果您想知道此asyncForEach函数是如何工作的，我可以从here获得。

我的仓库

/test/front/index.js

const testRunner = require( 'test-runner' )
const url = ( process.env.NODE_ENV == 'development' ) ? 'http://localhost:8888/element/...' : 'https://staging-url/element/...'

// tests to run
const tests = [
  require('./test.js')
]

testRunner( tests, url )

/test/front/test.js

const tape = require( 'tape' )

module.exports = async ( browser, url, capabilities, driver ) => {

  return new Promise( resolve => {

    tape( `Frontend test ${capabilities.browserName} ${capabilities.browser_version}`, async ( t ) => {

      const myButton = await browser.wait( driver.until.elementLocated( driver.By.css( 'my-button:first-of-type' ) ) )

      myButton.click()

      const marked = await myButton.getAttribute( 'marked' )
      t.ok(marked == "true", 'Button marked')

      //---
      // Test should end now
      //---
      t.end()

      resolve()

    } )

  })

}

/package.json

{
  ...
  "scripts": {
    "test": "NODE_ENV=development node test/front/ | tap-spec",
    "travis": "NODE_ENV=travis node test/front/ | tap-spec"
  }
  ...
}

当我想运行测试时，我在我的仓库中执行npm run test

请记住，我们只有一个测试（但也可以是多个测试），并且定义了两个浏览器，因此行为应为：

启动浏览器1并浏览（Chrome）
在浏览器1（Chrome）上进行一次测试
关闭浏览器1（Chrome）
启动浏览器2并导航（Safari）
在浏览器2（Safari）上进行一项测试
关闭浏览器2（Safari）
完成

问题

异步东西似乎工作得很好，浏览器按预期顺序启动。 问题是，即使我打t.end()，我也无法参加第二项测试（4之后就失败了），第一项测试还是没有完成。

我尝试过的

我尝试使用t.pass()，并且还使用NODE_ENV=development tape test/front/ | tap-spec运行CLI，但没有帮助。我还注意到，如果我没有在resolve()中进行test.js的测试，就可以顺利结束，但是当然我不会再进行下一个测试。

我也尝试像this issue那样改编我的代码，但没有解决问题。

与此同时，我还在磁带github页面上打开了一个issue。

所以我希望这个问题读起来不会太痛苦，任何帮助将不胜感激。

Answer 1

@Html.EditorFor(model => model.olddata "RangeSlider", new { id = "olddata", minValue = 1, maxValue = 10, defaultValue = 6, stepValue = 1 })似乎不适用于异步代码。请在其Github问题页面上查看这些讨论：

https://github.com/substack/tape/issues/223
https://github.com/substack/tape/issues/160

解决方案似乎是在调用任何异步代码之前，先用tape声明测试。

如果您只是按顺序打开浏览器，我还将尝试重构一些可能不需要的异步代码。

Answer 2

不幸的是，对于现有设置，我还没有任何答案，并且设法使工作方式略有不同。

我发现，tape()进程不能.end()，只要其他进程正在运行。就我而言，它是browser。因此，只要浏览器运行，我认为tape不会结束。

在我的example repo中没有browser，但必须继续运行其他内容以防止tape结束。

因此，我只能在一个tape流程中定义测试。由于我设法按顺序打开了浏览器并进行了测试，因此目前还可以。

如果要测试的东西很多，我将把这些东西分成不同的文件，然后将它们导入到主测试文件中。

我也从capabilities导入浏览器dependency，以便只定义一次。

下面是代码：

依赖主文件

{
  "browsers": [{
      "browserName": "Chrome",
      "browser_version": "41",
      "os": "Windows",
      "os_version": "10",
      "resolution": "1024x768",
      "browserstack.user": "username",
      "browserstack.key": "key"
    },
    }
      "browserName": "Safari",
      "browser_version": "10.0",
      "os": "OS X",
      "os_version": "Sierra",
      "resolution": "1024x768",
      "browserstack.user": "username",
      "browserstack.key": "key"
    }
  ]
}

test.js

const tape = require( "tape" )
const { Builder, By, until } = require( 'selenium-webdriver' );
const { browsers } = require( "dependency" )
const browserStack = 'http://hub-cloud.browserstack.com/wd/hub'

tape( "Browsers", async ( t ) => {

  await Promise.all( browsers.map( async ( capa ) => {

    const { browserName, browser_version, os } = capa

    const browser = new Builder().usingServer( browserStack ).withCapabilities( capa ).build();

    await browser.get( 'http://someurl.com' )

    const myButton = await browser.wait( until.elementLocated( By.css( 'my-button:first-of-type' ) ) )

    myButton.click()

    const marked = await myButton.getAttribute( 'marked' )

    t.ok(marked == "true", `${browserName} ${browser_version} ${os}`)

    await browser.quit()

  } ) )

  t.end()

} )

Answer 3

我会尝试简化测试的编写和执行方式：

您是否尝试过使用磁带二进制文件运行测试？例如tape test/front/test.js
同时简化test/front/test/js：（您必须弄清楚如何以其他方式传递参数；也许您可以仅出于调试目的而对它们进行硬编码？）

const tape = require( 'tape' )

tape( `your test outline`, ( t ) => {

  const alwaysEnd = () => t.end();

  new Promise((resolve, reject) => {
    // your async stuff here...
    // resolve() or reject() at the end
  }).then(alwaysEnd, alwaysEnd);
})

带异步forEach循环的磁带“测试退出而没有结束”错误

我在做什么

编辑：我创建了一个repo，其中包含问题的简化版本，从而再现了问题。

问题

我尝试过的

3 个答案: