Use correct babel-polyfill based on Gutenberg's presence

[IreneStr]

Summary

This PR can be summarized in the following changelog entry:

• Fixes a bug where a babel-polyfill would throw an error that there shouldn't be two babel-polyfills.

Relevant technical choices:

• If Gutenberg is available, we use their babel-polyfill (called wp-polyfill-ecmascript). If not, we use our own.
• This fix becomes relevant when Gutenberg 3.8 has been released. Framework: Use babel-polyfill in place of runtime builtins WordPress/gutenberg#9643 will be in that release. Because both Gutenberg and we will have a babel-polyfill, a console error will be thrown that there are two babel-polyfills.
• In Framework: Add wp-polyfill as central polyfill WordPress/gutenberg#9794 (which will be in Gutenberg 3.9 or later), Gutenberg changes its implementation of the polyfill. The implementation from this PR will also work with that.

Test instructions

This PR can be tested by following these steps:

Gutenberg 3.8

• Download Gutenberg's latest version.
• Before checking out this wordpress-seo branch, open a post in Gutenberg. You'll see a console warning that there are 2 versions of babel-polyfill.
• Checkout this wordpress-seo branch. Run composer install, yarn install en yarn start.
• Open a post in Gutenberg. The error should be gone, and there should not be any other console errors.
• Also check this without dev-server (remove the variable definition from your wp-config.php and use grunt:build instead of yarn start)
• Open a post in the classic editor. There should be no console errors.
• Open a post in the classic editor plugin. There should be no console errors.

Gutenberg pull 9794

• Checkout the Gutenberg branch from Framework: Add wp-polyfill as central polyfill WordPress/gutenberg#9794. Run composer install, npm install en npm run build.
• Before checking out this branch, open a post in Gutenberg. You'll see a console warning that there are 2 versions of babel-polyfill.
• Checkout this branch. Run composer install, yarn install en yarn start.
• Open a post in Gutenberg. The error should be gone, and there should not be any other console errors.
• Also check this without dev-server (remove the variable from your wp-config.php and use grunt:build)
• Open a post in the classic editor. There should be no console errors.
• Open a post in the classic editor plugin. There should be no console errors.

Quality assurance

• I have tested this code to the best of my abilities

Fixes #10953

[abotteram]

CR 👍

[afercia]

Seems the wp-polyfill thing has some upstream issues to start with, reported here: WordPress/gutenberg#9794 (comment)

Regardless, in IE11 I see the error about the double babel polyfill is gone. There are other errors though, and the analysys metabox is completely blank.

[afercia]

Ok so seems the upstream issue has been solved in a separate PR and merged on master. Master wasn't merged in the polyfill PR though. See WordPress/gutenberg#9794 (comment)

[afercia]

After the upstream issue has been solved and after yarn-upgrading yoastseo, most of the errors I was seeing in IE11 are gone.

But...

when activating the Classic Editor plugin, there are a few errors, starting from the edit.php page (the posts list):

the error points to js/src/wp-seo-quick-edit-handler.js see:
if ( [ "edit.php", "edit-tags.php" ].includes( currentScreen ) ) { ...

so apparently when Gutenberg is disabled, array.includes() is not polyfilled.

Also, there are a few errors in the edit post screen:

screenshot of the last part:

seems they're all related to Connect(Metabox) (created by MetaboxPortal) in MetaboxPortal in SlotFillProvider but I have no clue what the actual error is.

[afercia]

P.S. the includes() error on the edit.php page does not happen on trunk.

[afercia]

P.S. 2 also the Connect(Metabox) bla bla error doesn't happen on trunk.

[IreneStr]

Acceptance by @dariaknl done 👍
#10953 (comment)