fix: Revert "perf: always load focus-visible polyfill (#1780)" (#1784)

This reverts commit c98b198e60.
This commit is contained in:
Nolan Lawson 2020-05-18 22:19:33 -07:00 committed by GitHub
parent c98b198e60
commit a790004be7
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 21 additions and 8 deletions

View file

@ -6,13 +6,6 @@ import './routes/_utils/historyEvents'
import './routes/_utils/loadingMask'
import './routes/_utils/forceOnline'
// TODO: when some browser supports :focus-visible, feature-detect and async load polyfill
// Firefox: https://bugzilla.mozilla.org/show_bug.cgi?id=1445482
// WebKit: https://bugs.webkit.org/show_bug.cgi?id=185859
// Chrome: https://bugs.chromium.org/p/chromium/issues/detail?id=817199
// Chrome ITS: https://groups.google.com/a/chromium.org/forum/#!msg/blink-dev/XKNtAVyO4AY/ujOrvaYsBwAJ
import 'focus-visible'
loadPolyfills().then(() => {
console.log('init()')
sapper.start({ target: document.querySelector('#sapper') })

View file

@ -17,3 +17,7 @@ export const importCustomElementsPolyfill = () => import(
export const importIntl = () => import(
/* webpackChunkName: '$polyfill$-intl' */ 'intl'
)
export const importFocusVisible = () => import(
/* webpackChunkName: '$polyfill$-focus-visible' */ 'focus-visible'
)

View file

@ -1,10 +1,12 @@
import {
importCustomElementsPolyfill,
importFocusVisible,
importIndexedDBGetAllShim,
importIntersectionObserver,
importIntl,
importRequestIdleCallback
} from './asyncPolyfills'
import { supportsSelector } from './supportsSelector'
export function loadPolyfills () {
return Promise.all([
@ -12,6 +14,7 @@ export function loadPolyfills () {
typeof requestIdleCallback === 'undefined' && importRequestIdleCallback(),
!IDBObjectStore.prototype.getAll && importIndexedDBGetAllShim(),
typeof customElements === 'undefined' && importCustomElementsPolyfill(),
process.env.LEGACY && typeof Intl === 'undefined' && importIntl()
process.env.LEGACY && typeof Intl === 'undefined' && importIntl(),
!supportsSelector(':focus-visible') && importFocusVisible()
])
}

View file

@ -0,0 +1,13 @@
// See https://stackoverflow.com/a/8533927
export function supportsSelector (selector) {
const style = document.createElement('style')
document.head.appendChild(style)
try {
style.sheet.insertRule(selector + '{}', 0)
} catch (e) {
return false
} finally {
document.head.removeChild(style)
}
return true
}