Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Webpack + Typescript messaging.getToken() #2712

Closed
geminixandroid opened this issue Mar 4, 2020 · 8 comments
Closed

Webpack + Typescript messaging.getToken() #2712

geminixandroid opened this issue Mar 4, 2020 · 8 comments

Comments

@geminixandroid
Copy link

@geminixandroid geminixandroid commented Mar 4, 2020

[REQUIRED] Describe your environment

  • Operating System version: windows 10 x64
  • Browser version: Chrome 71.0.3578.98
  • Firebase SDK version: 7.9.3 (worked on 6.6.2)
  • Firebase Product: messaging
  • typescript 3.7.5

[REQUIRED] Describe the problem

firebase.messaging().getToken() throws error

TypeError: Failed to execute 'subscribe' on 'PushManager': The provided value is not of type '(ArrayBuffer or ArrayBufferView)'
    at index.esm.js:790
    at u (tslib.es6.js:99)
    at Object.next (tslib.es6.js:80)
    at s (tslib.es6.js:70)

at index.esm.js:790

swRegistration.pushManager.subscribe({
                            userVisibleOnly: true,
                            applicationServerKey: vapidKey
                        })]

Steps to reproduce:

look console
https://test.geminixandroid.com

Relevant Code:

package.json

  "dependencies": {
    "axios": "^0.19.2",
    "axios-retry": "^3.1.2",
    "core-js": "^3.6.4",
    "dexie": "^2.0.4",
    "dexie-observable": "^1.0.0-beta.5",
    "dom-to-image": "^2.6.0",
    "firebase": "^7.9.3",
    "leaflet": "^1.6.0",
    "qrcode.vue": "^1.7.0",
    "register-service-worker": "^1.6.2",
    "three": "^0.113.2",
    "vue": "^2.6.11",
    "vue-class-component": "^7.2.2",
    "vue-json-pretty": "^1.6.3",
    "vue-offline": "^2.0.8",
    "vue-pdf": "^4.0.7",
    "vue-property-decorator": "^8.4.0",
    "vue-router": "^3.1.5",
    "vue-signature-pad": "^1.1.17",
    "vue2-leaflet": "^2.4.2",
    "vuetify": "^2.2.11",
    "vuex": "^3.1.2",
    "vuex-persistedstate": "^2.7.0"
  },
  "devDependencies": {
    "@mdi/font": "^4.9.95",
    "@types/dom-to-image": "^2.6.0",
    "@types/leaflet": "^1.5.8",
    "@typescript-eslint/eslint-plugin": "^2.18.0",
    "@typescript-eslint/parser": "^2.18.0",
    "@vue/cli-plugin-babel": "~4.2.0",
    "@vue/cli-plugin-pwa": "~4.2.0",
    "@vue/cli-plugin-router": "~4.2.0",
    "@vue/cli-plugin-typescript": "~4.2.0",
    "@vue/cli-plugin-vuex": "~4.2.0",
    "@vue/cli-service": "~4.2.0",
    "@vue/eslint-config-typescript": "^5.0.1",
    "eslint": "^6.7.2",
    "eslint-plugin-vue": "^6.1.2",
    "sass": "^1.25.0",
    "sass-loader": "^8.0.2",
    "serviceworker-webpack-plugin": "^1.0.1",
    "tslint": "^6.0.0",
    "typescript": "^3.7.5",
    "vue-cli-plugin-vuetify": "^2.0.4",
    "vue-debounce-decorator": "^1.0.1",
    "vue-template-compiler": "^2.6.11",
    "webpack-bundle-analyzer": "^3.6.0"
  }
}
@Feiyang1
Copy link
Member

@Feiyang1 Feiyang1 commented Mar 4, 2020

I think this is the issue - https://bugs.chromium.org/p/chromium/issues/detail?id=802280
We recently switched vapidKey to base64 format in #2484, but older version of Chrome doesn't support base64 format in pushManager.subscribe.

I tested your link in Chrome 80, and there is no error. Can you please update your Chrome and retry?

@geminixandroid
Copy link
Author

@geminixandroid geminixandroid commented Mar 5, 2020

I think this is the issue - https://bugs.chromium.org/p/chromium/issues/detail?id=802280
We recently switched vapidKey to base64 format in #2484, but older version of Chrome doesn't support base64 format in pushManager.subscribe.

I tested your link in Chrome 80, and there is no error. Can you please update your Chrome and retry?

After update to chrome 80 it working now. Thank you.

@mitschabaude
Copy link

@mitschabaude mitschabaude commented Mar 24, 2020

Why is this closed? The messaging library is currently broken in all but the very newest versions of Chrome and therefore can't be used in any serious projects. Sounds like an open issue to me ;)

I'm sure you will fix it, thanks for your hard work by the way 👍

@zwu52
Copy link
Member

@zwu52 zwu52 commented Mar 25, 2020

This is a legitimate issue. The SDK should be backward compatible. Thanks @geminixandroid @mitschabaude for bringing this up. I am working on a fix.

@zwu52 zwu52 reopened this Mar 25, 2020
@zwu52 zwu52 self-assigned this Mar 25, 2020
@zwu52
Copy link
Member

@zwu52 zwu52 commented Mar 30, 2020

Fix should be picked up in the next release. From the release history, the culprit exists for 7.7.0<=version<=7.13.1. If you hit the issue, please consider using a newer version.

@zwu52 zwu52 closed this as completed Mar 30, 2020
@vandres
Copy link

@vandres vandres commented Mar 30, 2020

@zwu52 I am experiencing the bug also with 7.13.1, is it really fixed in that release?

@zwu52
Copy link
Member

@zwu52 zwu52 commented Mar 30, 2020

Hi @vandres, my previous comment was not accurate. Thanks for catching. I have updated above. The fix will be picked up in the next release (scheduled 2020-04-02). Please refer to the release note for updates.

@vandres
Copy link

@vandres vandres commented Mar 30, 2020

@zwu52 thanks for the heads up

zwu52 pushed a commit that referenced this issue Mar 31, 2020
This RN is meant for the release scheduled on 2020-04-02.
The fix will addresses the issues in #2712
zwu52 added a commit that referenced this issue Mar 31, 2020
* Create FCM's CHANGELOG.md with a release note.

This RN is meant for the release scheduled on 2020-04-02.
The fix will addresses the issues in #2712

* Update CHANGELOG.md

Improves wording on Eric's feedback. Thansk Eric

* Update CHANGELOG.md

Fix a type

Co-authored-by: Kai Wu <kaiwu@google.com>
zwu52 pushed a commit that referenced this issue Apr 14, 2020
Context: the tests were switched off a couple of years ago due to flakiness. It has not been maintained since then. During the time, Some Selenium API methods used were deprecated and removed; the Firebase projects used are no longer managed or owned by the FCM team. Consequently, the test became unfunctional. In the effort of providing safety for the upcoming FCM releases, this PR is created to fix, deflake, refactor and improve the old tests.

This PR did the following:
- Enabled comprehensive IT for chrome (ver.80). Now we are covering send&foreground recevie for FCM messages (messages with {notification} payload, {data} payload and {notification, data} payload), delete/update token, use default/customized ServiceWorker.

- Defalaked test. The IT is now reasonably stable without retry. Previously we are retrying 1 or 3 times.

- Optimized test. Previously we create a webDriver for each test, which is slow and annoying. Because a window is created and brought to focus and killed frequently, it makes working on other tasks and testing nearly impossible (Probably using a headless browser would work but I haven't found a satisfying solution to have the app in the state of foreground and background which is a requirement for FCM functions). With the way the tests are organized, the IT only spin up a new web driver when necessary. Some data on performance: (old) 'test-send' take 74 seconds (only measured 'test-send' because the other test suites were not functional at the time); (now) 'test-send', 'test-deleteToken', 'test-updateToken', 'test-useDefaultServiceWorker', 'test-useValidManifest' takes in total 33s (10 run average).

- General refactoring. Including refactors on expect blocks, createWebDriver, use const for constants usage, etc. The code should be much easier to understand and maintain.

Future work:
- Enable test on firefox once I get the notification permission working.
- Run the IC against some milestone chrome/firefox version (if it makes sense) to ensure backward compatibility. We should try to avoid #2712 . :)
@firebase firebase locked and limited conversation to collaborators Apr 30, 2020
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

6 participants