firebase - 不能使用cypress来使用Firestore本地模拟器来测试应用

Question

我有一个使用vue和firebase/firestore构建的应用程序。我使用firebase模拟器进行本地开发，并试图将我的开发工作流程与cypress集成。但是我在cypress中收到一个错误，如果我从浏览器访问该应用程序，则不会发生。

Firebase CLI版本是7.9.0， Cypress 版本是“^ 3.8.0”

我的npm脚本用于加载所有内容，如下所示:

"start": "firebase emulators:exec --only firestore \"npm run dev:appandtest\"",
"dev:appandtest": "concurrently -n \"app,test\" -c \"bgYellow.black,bgWhite.black\" \"npm:dev:app\" \"npm:dev:test\"",
"dev:app": "webpack-dev-server --config build/webpack.dev.js",
"dev:test": "npx cypress open", 

本地服务器在端口9000上运行，firebase仿真器在端口8080上运行。

运行完一切后，如果我从普通浏览器访问该应用程序，则此屏幕显示的一切都很好。

普通



然后，我尝试使用此代码运行基本的 Cypress 测试

    describe('The Home Page', function () {
      it('successfully loads', function () {
        cy.visit('/');
      });
    });

而且我收到以下错误消息:

    [2019-12-14T15:29:24.725Z]  @firebase/firestore: Firestore (6.6.2): Could not reach Cloud Firestore backend. Backend didn't respond within 10 seconds.
    This typically indicates that your device does not have a healthy Internet connection at the moment. The client will operate in offline mode until it is able to successfully connect to the backend.

    error.ts:166 Uncaught (in promise) FirebaseError: Failed to get document because the client is offline.
        at new FirestoreError (http://localhost:9000/bundle.js:11739:149)
        at Object.next (http://localhost:9000/bundle.js:16734:8)
        at next (http://localhost:9000/bundle.js:16725:4704)
        at http://localhost:9000/bundle.js:16430:411

我也截图了:
buggy



我试图研究答案，但找不到答案。在此先感谢您的帮助。

Answer 1

至少到目前为止，解决此问题的方法是启用experimentalForceLongPolling，如下所示:

// NOTE: do NOT put this in production.
firebase.firestore().settings({ experimentalForceLongPolling: true })

重要提示:这是一项实验功能，您应该使用环境变量对它进行一些条件检查。您不应该在生产环境中使用它。

最好的理由是 here:

The default behavior of Firestore's web SDK is to make use of WebChannel's streaming mode. The client makes what looks like an XHR, but then the server will hold the response open for 60 seconds and send as many server-initiated responses as it can during that time window.

The experimentalForLongPolling option forces the server to send only a single response per request.

和 here:

That is the same workaround we are using in cypress. I think the underlying problem is that Cypress is intercepting all network traffic so it can monitor and sometimes mock. However, the webchannel protocol used by firestore has multiple replies over the same http request. The Cypress code cannot handle this and will only forward the first reply and ignore the rest.