Gutenberg Theme: Add old-browser fallback

[dd32]

Currently the Gutenberg theme in old browsers is broken as it requires more modern browsers.

One particular error in IE9 is `'Blob' is undefined' which makes sense as that's not available until IE10.

Additionally, we should consider some 'richEditing' fallback as shown by [7970] and ​https://github.com/WordPress/gutenberg/issues/12772

I think we might be able to get away with a large centered block which suggests the browser is too out of date, linking off to ​https://browsehappy.com/ and maybe mentioning Gutenbergs browser requirements.

For reference, I'm attaching what it currently looks like in IE9.

[dufresnesteven]

I concur.

According to the official documentation ​https://make.wordpress.org/core/handbook/best-practices/browser-support/, Gutenberg supports IE 11+.

[dufresnesteven]

What about something like this? The colors are from Gutenberg's Notice component.

[dd32]

What about something like this? The colors are from Gutenberg's Notice component.

Something like that would be okay, but realistically unsupported browsers are currently going to be a WSOD as all JS execution will be failing. I guess that probably means we'd have to have it as the default HTML of the page that the editor then replaces?

[dufresnesteven]

Replying to dd32:

What about something like this? The colors are from Gutenberg's Notice component.

Something like that would be okay, but realistically unsupported browsers are currently going to be a WSOD as all JS execution will be failing. I guess that probably means we'd have to have it as the default HTML of the page that the editor then replaces?

Yeah, you're 100% correct. We'd have to put it above the Gutenberg controls.

[dufresnesteven]

What about something like this? A css hack could also work but i prefer not to have anything in the DOM for indexing purposes.

[dufresnesteven]

Previous diff visual outcome for ie < 11

[dufresnesteven]

Noting, that diff is experimental.

The copy should be improved.

I just want to validate the approach.

:)