* Runs a development mode. * * @param {!puppeteer.Browser} browser a Puppeteer controlled browser. * @param {!Array<!WebpageDef>} webpages an array of JSON objects containing * details about the webpages to snapshot. * @return {Promise }
(browser, webpages)
| 30 | * @return {Promise<void>} |
| 31 | */ |
| 32 | async function devMode(browser, webpages) { |
| 33 | /** @type {WebpageDef} */ |
| 34 | const webpage = await inquireForWebpage_(webpages); |
| 35 | const testName = await inquireForTestFunction_(webpage); |
| 36 | |
| 37 | log('info', 'The test will now run in a browser window...'); |
| 38 | const page = await newPage(browser, webpage.viewport); |
| 39 | await page.goto(`http://${HOST}:${PORT}/${webpage.url}`, { |
| 40 | waitUntil: 'networkidle0', |
| 41 | }); |
| 42 | |
| 43 | while (true) { |
| 44 | try { |
| 45 | await waitForPageLoad(page, webpage.name); |
| 46 | } catch { |
| 47 | log('warning', 'Page did not finish loading all AMP components'); |
| 48 | } |
| 49 | |
| 50 | // Based on test configuration, wait for a specific amount of time. |
| 51 | if (webpage.loading_complete_delay_ms) { |
| 52 | log( |
| 53 | 'info', |
| 54 | 'Waiting', |
| 55 | cyan(`${webpage.loading_complete_delay_ms}ms`), |
| 56 | 'for loading to complete' |
| 57 | ); |
| 58 | await sleep(webpage.loading_complete_delay_ms); |
| 59 | } |
| 60 | |
| 61 | if (testName) { |
| 62 | log('info', 'Executing custom test function', cyan(testName)); |
| 63 | try { |
| 64 | // Reload the interactive test file without caching on every iteration. |
| 65 | const testsFile = path.resolve(ROOT_DIR, webpage.interactive_tests); |
| 66 | delete require.cache[require.resolve(testsFile)]; |
| 67 | const testFunction = require(testsFile)[testName]; |
| 68 | await testFunction(page, webpage.name); |
| 69 | } catch (e) { |
| 70 | log('warning', 'Custom test function did not execute correctly:', e); |
| 71 | } |
| 72 | } |
| 73 | |
| 74 | log('info', '- Type', cyan('CSS selector'), 'to verify that it is visible'); |
| 75 | log('info', '- Start with', cyan('!'), 'to verify invisibility'); |
| 76 | log('info', '- Press enter on', cyan('empty prompt'), 'to reload the page'); |
| 77 | log('info', '-', cyan('Ctrl + C'), 'to quit.'); |
| 78 | while (true) { |
| 79 | let cssSelector = (await inquirer.input({message: '>'})).trim(); |
| 80 | if (!cssSelector) { |
| 81 | break; |
| 82 | } |
| 83 | |
| 84 | const verifySelectors = cssSelector.startsWith('!') |
| 85 | ? verifySelectorsInvisible |
| 86 | : verifySelectorsVisible; |
| 87 | const verifyingText = cssSelector.startsWith('!') |
| 88 | ? 'invisible' |
| 89 | : 'visible'; |
no test coverage detected