open.source/stylus
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Avoid potential transition patch conflicts (#720)

Browse Source 
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
1 changed files with 11 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
content/apply.js
View File

@ -346,22 +346,25 @@ 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);
});
}
function afterPaint() {
return new Promise(resolve => {
requestAnimationFrame(() => {
setTimeout(resolve);
});
});
}