data.coop/pinafore
8
0
Fork 0
Code Issues 1 Pull requests Packages Projects Releases Wiki Activity

perf: always load focus-visible polyfill (#1780)

Browse source
This commit is contained in:
Nolan Lawson 2020-05-18 21:11:13 -07:00 committed by GitHub
parent ea1315858d
commit c98b198e60
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 8 additions and 21 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
src/client.js
View file

@ -6,6 +6,13 @@ 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') })

4
src/routes/_utils/asyncPolyfills.js
View file

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

5
src/routes/_utils/loadPolyfills.js
View file

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

13
src/routes/_utils/supportsSelector.js
View file

@ -1,13 +0,0 @@
// 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
}