question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Promise.prototype.finally() broken in Firefox

See original GitHub issue

Version

3.0.0-rc.10

Node and OS info

Node 10.6.0 / Yarn 1.9.2 / macOS 10.13.5

Steps to reproduce

  1. Clone https://github.com/mserajnik/vue-cli-promise-finally
  2. Install with Yarn
  3. Run with yarn serve
  4. Open the development URL in Firefox (tested under Firefox 61.0.1)
  5. Check the console: [Vue warn]: Error in created hook: "TypeError: this.fetchData(...).then(...).catch(...).finally is not a function"

What is expected?

According to the MDN web docs, Promise.prototype.finally() is supported natively in Firefox since 58, so it should work, even without any polyfill.

What is actually happening?

Promise.prototype.finally() does not work in Firefox (61.0.1).


Not sure if I’m missing something obvious here – I’m not even sure if this is actually a bug or just a configuration issue (maybe I have to adjust my babel.config.js in some way?). What is weird is that Promise.prototype.finally() works in Safari when I run the same test app, which doesn’t have native support for it apparently – so the polyfill seems to be working there. I can only reproduce the issue in Firefox. A friend has also confirmed the same issue in Firefox under Windows 10.

Oh, and sorry if this issue belongs somewhere else. Since I couldn’t pin down if it’s a Firefox bug, an issue with Babel or one with the @vue/app preset (or just a configuration error on my end), it made the most sense to me to open it here first.

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Comments:26 (6 by maintainers)

github_iconTop GitHub Comments

12reactions
yyx990803commented, Aug 3, 2018

This is an issue in core-js - its promise polyfill replaces the native Promise in Firefox, however according to author of core-js, it is doing it because Firefox’s Promise implementation somehow fails a subclassing check so is technically not spec-compliant.

For now I’ve included es7.promise.finally by default to fix this in Vue CLI.

5reactions
imtblcommented, Aug 1, 2018

Doing the following seems to work:

// babel.config.js

module.exports = {
  presets: [
    ['@vue/app', { useBuiltIns: 'entry' }]
  ]
}
// src/main.js

import '@babel/polyfill'

[…]

It does increase the bundle size a bit (as expected), but that’s not really an issue.

According to this comment from Brian Ng:

Yep, there’s currently no usage mapping for .then, .catch or .finally.

So, issue solved for me. Do you think you could mention this limitation of having useBuiltIns in usage mode somewhere in the readme of @vue/babel-preset-app? I know that’s an issue/limitation with @babel/preset-env itself, but given that @vue/cli is pretty much zero config by default and very beginner-friendly for people who haven’t worked with webpack/Babel/etc. before, this is likely one of the first places they’d look if they encountered such an issue.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Promise.prototype.finally() - JavaScript - MDN Web Docs
The finally() method of a Promise object schedules a function to be called when the promise is settled (either fulfilled or rejected).
Read more >
Promise.prototype.finally | Can I use... Support ... - CanIUse
Promise.prototype.finally. - OTHER. When the promise is settled, whether fulfilled or rejected, the specified callback function is ... Firefox for Android.
Read more >
Only on Firefox: finally is not a function | promise overwritten ...
The first google query gave me this issue: Promise.prototype.finally() broken in Firefox, but I'm not using Vue-cli and all my packages are ...
Read more >
Promise.prototype.finally - Support Tables - W3cubDocs
IE Edge Firefox Chrome Safari Opera 107 107 TP 106 106 16.1 11 105 105 105 16.0 91
Read more >
Promise - JavaScript - UDN Web Docs: MDN Backup
Promise.prototype.finally(): Appends a handler to the promise, and returns a new promise that is resolved when the original promise is resolved.
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found