jest-expo-puppeteer-获取“哦，不！您的浏览器似乎未启用JavaScript”

编程问答 2022-06-13

问题描述

当我按照jest-expo-puppeteer documentation中的指南在jest-expo-puppeteer中运行一个非常简单的示例测试时，我不断收到奇怪错误的日志，而且似乎找不到任何预期的元素。所以我尝试打印出页面：

// Import the config so we can find the host URL
import config from '../../jest-puppeteer.config'

let response

beforeEach(async () => {
  // Jest puppeteer exposes the page object from Puppeteer
  response = await page.goto(config.url)
})

it(`should have welcome string`,async () => {
  const html = await page.evaluate(() => document.documentElement.outerHTML)
  console.log(html)
  await expect(page).toMatchElement('div[data-testid="welcome"]',{ text: 'Welcome!' })
})

页面结果显示文本Oh no! It looks like JavaScript is not enabled in your browser.：

...
      <body>
          <!-- 
            A generic no script element with a reload button and a message.
            Feel free to customize this however you'd like.
          -->
          <noscript>
            <form
              action=""
              style="background-color:#fff;position:fixed;top:0;left:0;right:0;bottom:0;z-index:9999;"
            >
              <div
                style="font-size:18px;font-family:Helvetica,sans-serif;line-height:24px;margin:10%;width:80%;"
              >
                <p>Oh no! It looks like JavaScript is not enabled in your browser.</p>
                <p style="margin:20px 0;">
                  <button
                    type="submit"
                    style="background-color: #4630EB; border-radius: 100px; border: none; Box-shadow: none; color: #fff; cursor: pointer; font-weight: bold; line-height: 20px; padding: 6px 16px;"
                  >
                    Reload
                  </button>
                </p>
              </div>
            </form>
          </noscript>
          <!-- The root element for your Expo app. -->
          <div id="root"><div class="css-view-1dbjc4n r-flex-13awgt0 r-pointerEvents-12vffkv"><div class="css-view-1dbjc4n r-flex-13awgt0 r-pointerEvents-12vffkv"></div></div></div>
        <script src="/static/js/bundle.js"></script>
      
      </body></html>
...

无头和浏览器内执行都会发生这种情况。

因此，似乎Javascript已关闭。 page对象是由jest-expo-puppeteer内部创建的，所以我想知道：

  • 如何在jest-expo-puppeteer中打开JavaScript？
  • 默认情况下是否应将其打开？也许我在设置中错过了某些东西？

解决方法

我自己找到了答案：

  • 内容Oh no! It looks like JavaScript is not enabled in your browser.始终存在于react-native文件中。似乎可以作为服务器的备份（如果浏览器确实未启用JavaScript，则会显示出来）。
  • 因此，无需打开JavaScript。实际上，JavaScript默认是打开的。
  • 之所以无法检测页面中的元素，是因为JavaScript执行尚未完成。当我输入等待语句时，它可以正常工作，例如：
it(`should have welcome string`,async () => {
  const welcome = await page.waitForSelector('div[data-testid="welcome"]')
  const text = await (await welcome.getProperty('innerHTML')).jsonValue()
  await expect(text).toMatch('Welcome!')
})
expojest-puppeteerjestjsreact-native