Avoid potential transition patch conflicts (#720)

8's fix - closes #706, closes #707
This commit is contained in:
narcolepticinsomniac 2019-05-26 06:12:02 -04:00 committed by GitHub
parent 8906cbbb1a
commit eb6888e44c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -346,26 +346,29 @@ const APPLY = (() => {
function applyTransitionPatch() {
// CSS transition bug workaround: since we insert styles asynchronously,
// the browsers, especially Firefox, may apply all transitions on page load
const className = chrome.runtime.id + '-transition-bug-fix';
const docId = document.documentElement.id ? '#' + document.documentElement.id : '';
document.documentElement.classList.add(className);
const el = styleInjector.createStyle('transition-patch');
// FIXME: this will trigger docRootObserver and cause a resort. We should
// move this function into style-injector.
document.documentElement.appendChild(el);
setStyleContent(el, `
${docId}.${CSS.escape(className)}:root * {
:root:not(#\\0):not(#\\0) * {
transition: none !important;
}
`)
.then(afterPaint)
.then(() => {
setTimeout(() => {
el.remove();
document.documentElement.classList.remove(className);
});
el.remove();
});
}
function afterPaint() {
return new Promise(resolve => {
requestAnimationFrame(() => {
setTimeout(resolve);
});
});
}
function orphanCheck(e) {
if (e && e.detail.method !== 'orphan') {
return;