2017-08-25 23:50:53 +00:00
|
|
|
/* global LZString */
|
2017-08-05 16:49:25 +00:00
|
|
|
/* global usercss, openEditor */
|
|
|
|
|
2017-03-26 02:30:59 +00:00
|
|
|
'use strict';
|
|
|
|
|
2017-04-11 10:51:40 +00:00
|
|
|
const RX_NAMESPACE = new RegExp([/[\s\r\n]*/,
|
|
|
|
/(@namespace[\s\r\n]+(?:[^\s\r\n]+[\s\r\n]+)?url\(http:\/\/.*?\);)/,
|
|
|
|
/[\s\r\n]*/].map(rx => rx.source).join(''), 'g');
|
|
|
|
const RX_CSS_COMMENTS = /\/\*[\s\S]*?\*\//g;
|
2017-06-25 10:16:23 +00:00
|
|
|
// eslint-disable-next-line no-var
|
|
|
|
var SLOPPY_REGEXP_PREFIX = '\0';
|
2017-04-26 21:49:03 +00:00
|
|
|
|
2017-09-03 08:12:18 +00:00
|
|
|
// CSS transition bug workaround: since we insert styles asynchronously,
|
|
|
|
// the browsers, especially Firefox, may apply all transitions on page load
|
|
|
|
const CSS_TRANSITION_SUPPRESSOR = '* { transition: none !important; }';
|
|
|
|
const RX_CSS_TRANSITION_DETECTOR = /([\s\n;/{]|-webkit-|-moz-)transition[\s\n]*:[\s\n]*(?!none)/;
|
|
|
|
|
2017-04-11 10:51:40 +00:00
|
|
|
// Note, only 'var'-declared variables are visible from another extension page
|
|
|
|
// eslint-disable-next-line no-var
|
|
|
|
var cachedStyles = {
|
2017-08-21 18:58:24 +00:00
|
|
|
list: null, // array of all styles
|
|
|
|
byId: new Map(), // all styles indexed by id
|
|
|
|
filters: new Map(), // filterStyles() parameters mapped to the returned results, 10k max
|
|
|
|
regexps: new Map(), // compiled style regexps
|
|
|
|
urlDomains: new Map(), // getDomain() results for 100 last checked urls
|
2017-09-03 08:12:18 +00:00
|
|
|
needTransitionPatch: new Map(), // FF bug workaround
|
2017-04-11 10:51:40 +00:00
|
|
|
mutex: {
|
2017-08-21 18:58:24 +00:00
|
|
|
inProgress: false, // while getStyles() is reading IndexedDB all subsequent calls
|
|
|
|
onDone: [], // to getStyles() are queued and resolved when the first one finishes
|
2017-04-11 10:51:40 +00:00
|
|
|
},
|
|
|
|
};
|
|
|
|
|
2017-04-23 12:19:18 +00:00
|
|
|
// eslint-disable-next-line no-var
|
|
|
|
var chromeLocal = {
|
|
|
|
get(options) {
|
|
|
|
return new Promise(resolve => {
|
|
|
|
chrome.storage.local.get(options, data => resolve(data));
|
|
|
|
});
|
|
|
|
},
|
|
|
|
set(data) {
|
|
|
|
return new Promise(resolve => {
|
|
|
|
chrome.storage.local.set(data, () => resolve(data));
|
|
|
|
});
|
|
|
|
},
|
2017-09-02 15:36:32 +00:00
|
|
|
remove(keyOrKeys) {
|
|
|
|
return new Promise(resolve => {
|
|
|
|
chrome.storage.local.remove(keyOrKeys, resolve);
|
|
|
|
});
|
|
|
|
},
|
2017-04-23 12:19:18 +00:00
|
|
|
getValue(key) {
|
|
|
|
return chromeLocal.get(key).then(data => data[key]);
|
|
|
|
},
|
|
|
|
setValue(key, value) {
|
|
|
|
return chromeLocal.set({[key]: value});
|
|
|
|
},
|
|
|
|
};
|
|
|
|
|
2017-08-25 23:50:53 +00:00
|
|
|
// eslint-disable-next-line no-var
|
|
|
|
var chromeSync = {
|
|
|
|
get(options) {
|
|
|
|
return new Promise(resolve => {
|
2017-08-28 05:22:19 +00:00
|
|
|
chrome.storage.sync.get(options, resolve);
|
2017-08-25 23:50:53 +00:00
|
|
|
});
|
|
|
|
},
|
|
|
|
set(data) {
|
|
|
|
return new Promise(resolve => {
|
|
|
|
chrome.storage.sync.set(data, () => resolve(data));
|
|
|
|
});
|
|
|
|
},
|
2017-08-28 05:22:19 +00:00
|
|
|
getLZValue(key) {
|
2017-08-28 10:53:10 +00:00
|
|
|
return chromeSync.getLZValues([key]).then(data => data[key]);
|
2017-08-25 23:50:53 +00:00
|
|
|
},
|
2017-08-28 05:22:19 +00:00
|
|
|
getLZValues(keys) {
|
2017-08-28 10:53:10 +00:00
|
|
|
return chromeSync.get(keys).then((data = {}) => {
|
|
|
|
for (const key of keys) {
|
|
|
|
const value = data[key];
|
|
|
|
data[key] = value && tryJSONparse(LZString.decompressFromUTF16(value));
|
|
|
|
}
|
|
|
|
return data;
|
|
|
|
});
|
2017-08-28 05:22:19 +00:00
|
|
|
},
|
|
|
|
setLZValue(key, value) {
|
2017-08-25 23:50:53 +00:00
|
|
|
return chromeSync.set({[key]: LZString.compressToUTF16(JSON.stringify(value))});
|
|
|
|
}
|
|
|
|
};
|
|
|
|
|
2017-09-02 15:36:32 +00:00
|
|
|
// eslint-disable-next-line no-var
|
|
|
|
var dbExec = dbExecIndexedDB;
|
2017-09-03 18:25:19 +00:00
|
|
|
dbExec.initialized = false;
|
2017-09-02 15:36:32 +00:00
|
|
|
|
|
|
|
// we use chrome.storage.local fallback if IndexedDB doesn't save data,
|
|
|
|
// which, once detected on the first run, is remembered in chrome.storage.local
|
|
|
|
// for reliablility and in localStorage for fast synchronous access
|
|
|
|
// (FF may block localStorage depending on its privacy options)
|
|
|
|
do {
|
2017-09-03 18:25:19 +00:00
|
|
|
const done = () => {
|
|
|
|
getStyles().then(() => {
|
|
|
|
dbExec.initialized = true;
|
|
|
|
window.dispatchEvent(new Event('storageReady'));
|
|
|
|
});
|
|
|
|
};
|
2017-09-02 15:36:32 +00:00
|
|
|
const fallback = () => {
|
|
|
|
dbExec = dbExecChromeStorage;
|
|
|
|
chromeLocal.set({dbInChromeStorage: true});
|
|
|
|
localStorage.dbInChromeStorage = 'true';
|
|
|
|
ignoreChromeError();
|
2017-09-03 18:25:19 +00:00
|
|
|
done();
|
2017-09-02 15:36:32 +00:00
|
|
|
};
|
|
|
|
const fallbackSet = localStorage.dbInChromeStorage;
|
|
|
|
if (fallbackSet === 'true' || !tryCatch(() => indexedDB)) {
|
|
|
|
fallback();
|
|
|
|
break;
|
|
|
|
} else if (fallbackSet === 'false') {
|
2017-09-03 18:25:19 +00:00
|
|
|
done();
|
2017-09-02 15:36:32 +00:00
|
|
|
break;
|
|
|
|
}
|
|
|
|
chromeLocal.get('dbInChromeStorage')
|
|
|
|
.then(data =>
|
|
|
|
data && data.dbInChromeStorage && Promise.reject())
|
|
|
|
.then(() => dbExecIndexedDB('getAllKeys', IDBKeyRange.lowerBound(1), 1))
|
|
|
|
.then(({target}) => (
|
|
|
|
(target.result || [])[0] ?
|
|
|
|
Promise.reject('ok') :
|
2017-09-03 18:56:46 +00:00
|
|
|
dbExecIndexedDB('put', {id: -1})))
|
|
|
|
.then(() =>
|
|
|
|
dbExecIndexedDB('get', -1))
|
2017-09-02 15:36:32 +00:00
|
|
|
.then(({target}) => (
|
|
|
|
(target.result || {}).id === -1 ?
|
2017-09-03 18:56:46 +00:00
|
|
|
dbExecIndexedDB('delete', -1) :
|
2017-09-02 15:36:32 +00:00
|
|
|
Promise.reject()))
|
2017-09-03 18:56:46 +00:00
|
|
|
.then(() =>
|
|
|
|
Promise.reject('ok'))
|
2017-09-02 15:36:32 +00:00
|
|
|
.catch(result => {
|
|
|
|
if (result === 'ok') {
|
|
|
|
chromeLocal.set({dbInChromeStorage: false});
|
|
|
|
localStorage.dbInChromeStorage = 'false';
|
2017-09-03 18:25:19 +00:00
|
|
|
done();
|
2017-09-02 15:36:32 +00:00
|
|
|
} else {
|
|
|
|
fallback();
|
|
|
|
}
|
|
|
|
});
|
|
|
|
} while (0);
|
2017-04-11 10:51:40 +00:00
|
|
|
|
|
|
|
|
2017-09-02 15:36:32 +00:00
|
|
|
function dbExecIndexedDB(method, ...args) {
|
2017-04-25 21:48:27 +00:00
|
|
|
return new Promise((resolve, reject) => {
|
|
|
|
Object.assign(indexedDB.open('stylish', 2), {
|
|
|
|
onsuccess(event) {
|
|
|
|
const database = event.target.result;
|
|
|
|
if (!method) {
|
|
|
|
resolve(database);
|
|
|
|
} else {
|
|
|
|
const transaction = database.transaction(['styles'], 'readwrite');
|
|
|
|
const store = transaction.objectStore('styles');
|
2017-09-02 15:36:32 +00:00
|
|
|
Object.assign(store[method](...args), {
|
2017-04-25 21:48:27 +00:00
|
|
|
onsuccess: event => resolve(event, store, transaction, database),
|
|
|
|
onerror: reject,
|
|
|
|
});
|
|
|
|
}
|
|
|
|
},
|
|
|
|
onerror(event) {
|
2017-08-24 13:30:13 +00:00
|
|
|
console.warn(event.target.error || event.target.errorCode);
|
2017-04-25 21:48:27 +00:00
|
|
|
reject(event);
|
|
|
|
},
|
|
|
|
onupgradeneeded(event) {
|
2017-07-16 18:02:00 +00:00
|
|
|
if (event.oldVersion === 0) {
|
2017-04-25 21:48:27 +00:00
|
|
|
event.target.result.createObjectStore('styles', {
|
|
|
|
keyPath: 'id',
|
|
|
|
autoIncrement: true,
|
|
|
|
});
|
|
|
|
}
|
|
|
|
},
|
|
|
|
});
|
|
|
|
});
|
2017-03-26 02:30:59 +00:00
|
|
|
}
|
2015-02-09 04:02:08 +00:00
|
|
|
|
Improve style caching, cache requests too, add code:false mode
Previously, when a cache was invalidated and every tab/iframe issued a getStyles request, we previous needlessly accessed IndexedDB for each of these requests. It happened because 1) the global cachedStyles was created only at the end of the async DB-reading, 2) and each style record is retrieved asynchronously so the single threaded JS engine interleaved all these operations. It could easily span a few seconds when many tabs are open and you have like 100 styles.
Now, in getStyles: all requests issued while cachedStyles is being populated are queued and invoked at the end.
Now, in filterStyles: all requests are cached using the request's options combined in a string as a key. It also helps on each navigation because we monitor page loading process at different stages: before, when committed, history traversal, requesting applicable styles by a content script. Icon badge update also may issue a copy of the just issued request by one of the navigation listeners.
Now, the caches are invalidated smartly: style add/update/delete/toggle only purges filtering cache, and modifies style cache in-place without re-reading the entire IndexedDB.
Now, code:false mode for manage page that only needs style meta. It reduces the transferred message size 10-100 times thus reducing the overhead caused by to internal JSON-fication in the extensions API.
Also fast&direct getStylesSafe for own pages; code cosmetics
2017-03-17 22:50:35 +00:00
|
|
|
|
2017-09-02 15:36:32 +00:00
|
|
|
function dbExecChromeStorage(method, data) {
|
|
|
|
const STYLE_KEY_PREFIX = 'style-';
|
|
|
|
switch (method) {
|
|
|
|
case 'get':
|
|
|
|
return chromeLocal.getValue(STYLE_KEY_PREFIX + data)
|
|
|
|
.then(result => ({target: {result}}));
|
|
|
|
|
|
|
|
case 'put':
|
|
|
|
if (!data.id) {
|
|
|
|
return getStyles().then(() => {
|
|
|
|
data.id = 1;
|
|
|
|
for (const style of cachedStyles.list) {
|
|
|
|
data.id = Math.max(data.id, style.id + 1);
|
|
|
|
}
|
|
|
|
return dbExecChromeStorage('put', data);
|
|
|
|
});
|
|
|
|
}
|
|
|
|
return chromeLocal.setValue(STYLE_KEY_PREFIX + data.id, data)
|
|
|
|
.then(() => (chrome.runtime.lastError ? Promise.reject() : data.id));
|
|
|
|
|
|
|
|
case 'delete':
|
|
|
|
return chromeLocal.remove(STYLE_KEY_PREFIX + data);
|
|
|
|
|
|
|
|
case 'getAll':
|
|
|
|
return chromeLocal.get(null).then(storage => {
|
|
|
|
const styles = [];
|
|
|
|
for (const key in storage) {
|
|
|
|
if (key.startsWith(STYLE_KEY_PREFIX) &&
|
|
|
|
Number(key.substr(STYLE_KEY_PREFIX.length))) {
|
|
|
|
styles.push(storage[key]);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
return {target: {result: styles}};
|
|
|
|
});
|
|
|
|
}
|
|
|
|
return Promise.reject();
|
|
|
|
}
|
|
|
|
|
|
|
|
|
2017-04-25 21:48:27 +00:00
|
|
|
function getStyles(options) {
|
2017-03-26 02:30:59 +00:00
|
|
|
if (cachedStyles.list) {
|
2017-04-25 21:48:27 +00:00
|
|
|
return Promise.resolve(filterStyles(options));
|
2017-03-26 02:30:59 +00:00
|
|
|
}
|
|
|
|
if (cachedStyles.mutex.inProgress) {
|
2017-04-25 21:48:27 +00:00
|
|
|
return new Promise(resolve => {
|
|
|
|
cachedStyles.mutex.onDone.push({options, resolve});
|
|
|
|
});
|
2017-03-26 02:30:59 +00:00
|
|
|
}
|
|
|
|
cachedStyles.mutex.inProgress = true;
|
|
|
|
|
2017-04-25 21:48:27 +00:00
|
|
|
return dbExec('getAll').then(event => {
|
|
|
|
cachedStyles.list = event.target.result || [];
|
|
|
|
cachedStyles.byId.clear();
|
|
|
|
for (const style of cachedStyles.list) {
|
|
|
|
cachedStyles.byId.set(style.id, style);
|
|
|
|
}
|
2017-03-26 02:30:59 +00:00
|
|
|
|
2017-04-25 21:48:27 +00:00
|
|
|
cachedStyles.mutex.inProgress = false;
|
|
|
|
for (const {options, resolve} of cachedStyles.mutex.onDone) {
|
|
|
|
resolve(filterStyles(options));
|
|
|
|
}
|
|
|
|
cachedStyles.mutex.onDone = [];
|
|
|
|
return filterStyles(options);
|
|
|
|
});
|
2015-01-30 17:07:24 +00:00
|
|
|
}
|
|
|
|
|
Improve style caching, cache requests too, add code:false mode
Previously, when a cache was invalidated and every tab/iframe issued a getStyles request, we previous needlessly accessed IndexedDB for each of these requests. It happened because 1) the global cachedStyles was created only at the end of the async DB-reading, 2) and each style record is retrieved asynchronously so the single threaded JS engine interleaved all these operations. It could easily span a few seconds when many tabs are open and you have like 100 styles.
Now, in getStyles: all requests issued while cachedStyles is being populated are queued and invoked at the end.
Now, in filterStyles: all requests are cached using the request's options combined in a string as a key. It also helps on each navigation because we monitor page loading process at different stages: before, when committed, history traversal, requesting applicable styles by a content script. Icon badge update also may issue a copy of the just issued request by one of the navigation listeners.
Now, the caches are invalidated smartly: style add/update/delete/toggle only purges filtering cache, and modifies style cache in-place without re-reading the entire IndexedDB.
Now, code:false mode for manage page that only needs style meta. It reduces the transferred message size 10-100 times thus reducing the overhead caused by to internal JSON-fication in the extensions API.
Also fast&direct getStylesSafe for own pages; code cosmetics
2017-03-17 22:50:35 +00:00
|
|
|
|
2017-03-30 23:18:41 +00:00
|
|
|
function filterStyles({
|
2017-04-19 16:13:11 +00:00
|
|
|
enabled = null,
|
2017-03-30 23:18:41 +00:00
|
|
|
url = null,
|
|
|
|
id = null,
|
|
|
|
matchUrl = null,
|
|
|
|
asHash = null,
|
|
|
|
strictRegexp = true, // used by the popup to detect bad regexps
|
|
|
|
} = {}) {
|
2017-07-16 18:02:00 +00:00
|
|
|
enabled = enabled === null || typeof enabled === 'boolean' ? enabled :
|
|
|
|
typeof enabled === 'string' ? enabled === 'true' : null;
|
2017-03-30 23:18:41 +00:00
|
|
|
id = id === null ? null : Number(id);
|
2017-03-26 02:30:59 +00:00
|
|
|
|
2017-07-16 18:02:00 +00:00
|
|
|
if (
|
|
|
|
enabled === null &&
|
|
|
|
url === null &&
|
|
|
|
id === null &&
|
|
|
|
matchUrl === null &&
|
|
|
|
asHash !== true
|
|
|
|
) {
|
2017-03-30 23:18:41 +00:00
|
|
|
return cachedStyles.list;
|
2017-03-26 02:30:59 +00:00
|
|
|
}
|
|
|
|
|
2017-08-16 17:40:24 +00:00
|
|
|
if (matchUrl && !URLS.supported(matchUrl)) {
|
2017-04-12 13:56:41 +00:00
|
|
|
return asHash ? {} : [];
|
|
|
|
}
|
|
|
|
|
2017-09-03 15:16:00 +00:00
|
|
|
const blankHash = asHash && {
|
|
|
|
disableAll: prefs.get('disableAll'),
|
|
|
|
exposeIframes: prefs.get('exposeIframes'),
|
|
|
|
};
|
|
|
|
|
2017-03-26 02:30:59 +00:00
|
|
|
// add \t after url to prevent collisions (not sure it can actually happen though)
|
2017-03-30 23:18:41 +00:00
|
|
|
const cacheKey = ' ' + enabled + url + '\t' + id + matchUrl + '\t' + asHash + strictRegexp;
|
2017-03-26 02:30:59 +00:00
|
|
|
const cached = cachedStyles.filters.get(cacheKey);
|
|
|
|
if (cached) {
|
|
|
|
cached.hits++;
|
|
|
|
cached.lastHit = Date.now();
|
|
|
|
return asHash
|
2017-04-28 23:36:10 +00:00
|
|
|
? Object.assign(blankHash, cached.styles)
|
2017-03-26 02:30:59 +00:00
|
|
|
: cached.styles;
|
|
|
|
}
|
|
|
|
|
2017-04-13 18:03:25 +00:00
|
|
|
return filterStylesInternal({
|
|
|
|
enabled,
|
|
|
|
url,
|
|
|
|
id,
|
|
|
|
matchUrl,
|
|
|
|
asHash,
|
|
|
|
strictRegexp,
|
2017-04-28 23:36:10 +00:00
|
|
|
blankHash,
|
2017-04-13 18:03:25 +00:00
|
|
|
cacheKey,
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
function filterStylesInternal({
|
|
|
|
// js engines don't like big functions (V8 often deoptimized the original filterStyles)
|
|
|
|
// it also makes sense to extract the less frequently executed code
|
|
|
|
enabled,
|
|
|
|
url,
|
|
|
|
id,
|
|
|
|
matchUrl,
|
|
|
|
asHash,
|
|
|
|
strictRegexp,
|
2017-04-28 23:36:10 +00:00
|
|
|
blankHash,
|
2017-04-13 18:03:25 +00:00
|
|
|
cacheKey,
|
|
|
|
}) {
|
2017-03-26 07:42:13 +00:00
|
|
|
if (matchUrl && !cachedStyles.urlDomains.has(matchUrl)) {
|
|
|
|
cachedStyles.urlDomains.set(matchUrl, getDomains(matchUrl));
|
|
|
|
for (let i = cachedStyles.urlDomains.size - 100; i > 0; i--) {
|
|
|
|
const firstKey = cachedStyles.urlDomains.keys().next().value;
|
|
|
|
cachedStyles.urlDomains.delete(firstKey);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2017-03-26 02:30:59 +00:00
|
|
|
const styles = id === null
|
2017-03-30 23:18:41 +00:00
|
|
|
? cachedStyles.list
|
|
|
|
: [cachedStyles.byId.get(id)];
|
2017-09-03 15:16:00 +00:00
|
|
|
if (!styles[0]) {
|
2017-03-26 02:30:59 +00:00
|
|
|
// may happen when users [accidentally] reopen an old URL
|
|
|
|
// of edit.html with a non-existent style id parameter
|
2017-09-03 19:34:42 +00:00
|
|
|
return asHash ? blankHash : [];
|
2017-03-26 02:30:59 +00:00
|
|
|
}
|
2017-09-03 19:34:42 +00:00
|
|
|
const filtered = asHash ? {} : [];
|
2017-03-30 23:18:41 +00:00
|
|
|
const needSections = asHash || matchUrl !== null;
|
2017-08-16 17:40:24 +00:00
|
|
|
const matchUrlBase = matchUrl && matchUrl.includes('#') && matchUrl.split('#', 1)[0];
|
2017-03-30 23:18:41 +00:00
|
|
|
|
2017-07-14 08:46:10 +00:00
|
|
|
let style;
|
|
|
|
for (let i = 0; (style = styles[i]); i++) {
|
2017-07-16 18:02:00 +00:00
|
|
|
if ((enabled === null || style.enabled === enabled)
|
|
|
|
&& (url === null || style.url === url)
|
|
|
|
&& (id === null || style.id === id)) {
|
2017-03-30 23:18:41 +00:00
|
|
|
const sections = needSections &&
|
2017-08-16 17:40:24 +00:00
|
|
|
getApplicableSections({
|
|
|
|
style,
|
|
|
|
matchUrl,
|
|
|
|
strictRegexp,
|
|
|
|
stopOnFirst: !asHash,
|
|
|
|
skipUrlCheck: true,
|
|
|
|
matchUrlBase,
|
|
|
|
});
|
2017-03-26 02:30:59 +00:00
|
|
|
if (asHash) {
|
|
|
|
if (sections.length) {
|
|
|
|
filtered[style.id] = sections;
|
|
|
|
}
|
|
|
|
} else if (matchUrl === null || sections.length) {
|
|
|
|
filtered.push(style);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
2017-04-13 18:03:25 +00:00
|
|
|
|
2017-03-26 02:30:59 +00:00
|
|
|
cachedStyles.filters.set(cacheKey, {
|
|
|
|
styles: filtered,
|
|
|
|
lastHit: Date.now(),
|
|
|
|
hits: 1,
|
|
|
|
});
|
|
|
|
if (cachedStyles.filters.size > 10000) {
|
|
|
|
cleanupCachedFilters();
|
|
|
|
}
|
2017-04-13 18:03:25 +00:00
|
|
|
|
2017-09-03 19:34:42 +00:00
|
|
|
// a shallow copy is needed because the cache doesn't store options like disableAll
|
2017-03-26 02:30:59 +00:00
|
|
|
return asHash
|
2017-04-28 23:36:10 +00:00
|
|
|
? Object.assign(blankHash, filtered)
|
2017-03-26 02:30:59 +00:00
|
|
|
: filtered;
|
2015-01-30 17:07:24 +00:00
|
|
|
}
|
|
|
|
|
Improve style caching, cache requests too, add code:false mode
Previously, when a cache was invalidated and every tab/iframe issued a getStyles request, we previous needlessly accessed IndexedDB for each of these requests. It happened because 1) the global cachedStyles was created only at the end of the async DB-reading, 2) and each style record is retrieved asynchronously so the single threaded JS engine interleaved all these operations. It could easily span a few seconds when many tabs are open and you have like 100 styles.
Now, in getStyles: all requests issued while cachedStyles is being populated are queued and invoked at the end.
Now, in filterStyles: all requests are cached using the request's options combined in a string as a key. It also helps on each navigation because we monitor page loading process at different stages: before, when committed, history traversal, requesting applicable styles by a content script. Icon badge update also may issue a copy of the just issued request by one of the navigation listeners.
Now, the caches are invalidated smartly: style add/update/delete/toggle only purges filtering cache, and modifies style cache in-place without re-reading the entire IndexedDB.
Now, code:false mode for manage page that only needs style meta. It reduces the transferred message size 10-100 times thus reducing the overhead caused by to internal JSON-fication in the extensions API.
Also fast&direct getStylesSafe for own pages; code cosmetics
2017-03-17 22:50:35 +00:00
|
|
|
|
2017-08-05 16:49:25 +00:00
|
|
|
// Parse the source and find the duplication
|
|
|
|
// {id: int, style: object, source: string, checkDup: boolean}
|
|
|
|
function filterUsercss(req) {
|
|
|
|
return Promise.resolve().then(() => {
|
|
|
|
let style;
|
|
|
|
if (req.source) {
|
|
|
|
style = usercss.buildMeta(req.source);
|
|
|
|
} else {
|
|
|
|
style = req.style;
|
|
|
|
}
|
|
|
|
if (!style.id && req.id) {
|
|
|
|
style.id = req.id;
|
|
|
|
}
|
2017-09-05 02:31:24 +00:00
|
|
|
let pending;
|
|
|
|
if (!style.sections || !style.sections.length) {
|
|
|
|
pending = usercss.buildCode(style);
|
|
|
|
} else {
|
|
|
|
pending = Promise.resolve(style);
|
|
|
|
}
|
2017-08-05 16:49:25 +00:00
|
|
|
if (!style.id && req.checkDup) {
|
2017-09-05 02:31:24 +00:00
|
|
|
return Promise.all([pending, findDupUsercss(style)])
|
|
|
|
.then(([, dup]) => ({status: 'success', style, dup}));
|
2017-08-05 16:49:25 +00:00
|
|
|
}
|
2017-09-05 02:31:24 +00:00
|
|
|
return pending.then(() => ({status: 'success', style}));
|
2017-08-05 16:49:25 +00:00
|
|
|
}).catch(err => ({status: 'error', error: String(err)}));
|
|
|
|
}
|
|
|
|
|
|
|
|
function saveUsercss(style) {
|
|
|
|
// This function use `saveStyle`, however the response is different.
|
2017-09-10 14:04:43 +00:00
|
|
|
return Promise.resolve()
|
|
|
|
.then(() => {
|
|
|
|
if (!style.name || !style.namespace) {
|
|
|
|
return Object.assign(usercss.buildMeta(style.source), style);
|
|
|
|
}
|
|
|
|
return style;
|
|
|
|
})
|
|
|
|
.then(saveStyle)
|
2017-08-05 16:49:25 +00:00
|
|
|
.then(result => ({
|
|
|
|
status: 'success',
|
|
|
|
style: result
|
|
|
|
}))
|
|
|
|
.catch(err => ({
|
|
|
|
status: 'error',
|
|
|
|
error: String(err)
|
|
|
|
}));
|
|
|
|
}
|
|
|
|
|
|
|
|
|
2017-03-25 02:35:54 +00:00
|
|
|
function saveStyle(style) {
|
2017-08-05 16:49:25 +00:00
|
|
|
let id = Number(style.id) || null;
|
2017-04-25 21:48:27 +00:00
|
|
|
const reason = style.reason;
|
|
|
|
const notify = style.notify !== false;
|
|
|
|
delete style.method;
|
|
|
|
delete style.reason;
|
|
|
|
delete style.notify;
|
|
|
|
if (!style.name) {
|
|
|
|
delete style.name;
|
|
|
|
}
|
2017-07-14 08:46:10 +00:00
|
|
|
let existed;
|
|
|
|
let codeIsUpdated;
|
2017-08-05 16:49:25 +00:00
|
|
|
|
|
|
|
if (style.usercss) {
|
|
|
|
return processUsercss(style).then(decide);
|
|
|
|
}
|
|
|
|
|
2017-07-16 18:02:00 +00:00
|
|
|
if (reason === 'update' || reason === 'update-digest') {
|
2017-05-03 15:37:47 +00:00
|
|
|
return calcStyleDigest(style).then(digest => {
|
|
|
|
style.originalDigest = digest;
|
2017-05-03 16:06:14 +00:00
|
|
|
return decide();
|
2017-03-26 02:30:59 +00:00
|
|
|
});
|
2017-05-03 15:37:47 +00:00
|
|
|
}
|
2017-07-16 18:02:00 +00:00
|
|
|
if (reason === 'import') {
|
2017-08-21 18:58:24 +00:00
|
|
|
style.originalDigest = style.originalDigest || style.styleDigest; // TODO: remove in the future
|
|
|
|
delete style.styleDigest; // TODO: remove in the future
|
2017-07-16 18:02:00 +00:00
|
|
|
if (typeof style.originalDigest !== 'string' || style.originalDigest.length !== 40) {
|
2017-05-03 15:37:47 +00:00
|
|
|
delete style.originalDigest;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
return decide();
|
|
|
|
|
2017-08-05 16:49:25 +00:00
|
|
|
function processUsercss(style) {
|
|
|
|
return findDupUsercss(style).then(dup => {
|
|
|
|
if (!dup) {
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
if (!id) {
|
|
|
|
id = dup.id;
|
|
|
|
}
|
|
|
|
if (reason === 'config') {
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
// preserve style.vars during update
|
2017-09-09 11:29:35 +00:00
|
|
|
usercss.assignVars(style, dup);
|
2017-08-05 16:49:25 +00:00
|
|
|
})
|
|
|
|
.then(() => usercss.buildCode(style));
|
|
|
|
}
|
|
|
|
|
2017-05-03 15:37:47 +00:00
|
|
|
function decide() {
|
|
|
|
if (id !== null) {
|
|
|
|
// Update or create
|
|
|
|
style.id = id;
|
|
|
|
return dbExec('get', id).then((event, store) => {
|
|
|
|
const oldStyle = event.target.result;
|
|
|
|
existed = Boolean(oldStyle);
|
2017-07-16 18:02:00 +00:00
|
|
|
if (reason === 'update-digest' && oldStyle.originalDigest === style.originalDigest) {
|
2017-05-03 15:37:47 +00:00
|
|
|
return style;
|
|
|
|
}
|
2017-06-06 01:40:08 +00:00
|
|
|
codeIsUpdated = !existed || 'sections' in style && !styleSectionsEqual(style, oldStyle);
|
2017-05-03 15:37:47 +00:00
|
|
|
style = Object.assign({}, oldStyle, style);
|
|
|
|
return write(style, store);
|
|
|
|
});
|
|
|
|
} else {
|
|
|
|
// Create
|
|
|
|
delete style.id;
|
|
|
|
style = Object.assign({
|
|
|
|
// Set optional things if they're undefined
|
|
|
|
enabled: true,
|
|
|
|
updateUrl: null,
|
|
|
|
md5Url: null,
|
|
|
|
url: null,
|
|
|
|
originalMd5: null,
|
|
|
|
}, style);
|
|
|
|
return write(style);
|
|
|
|
}
|
2017-04-25 21:48:27 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
function write(style, store) {
|
|
|
|
style.sections = normalizeStyleSections(style);
|
|
|
|
if (store) {
|
|
|
|
return new Promise(resolve => {
|
|
|
|
store.put(style).onsuccess = event => resolve(done(event));
|
|
|
|
});
|
|
|
|
} else {
|
|
|
|
return dbExec('put', style).then(done);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
function done(event) {
|
2017-07-16 18:02:00 +00:00
|
|
|
if (reason === 'update-digest') {
|
2017-05-03 15:37:47 +00:00
|
|
|
return style;
|
|
|
|
}
|
2017-04-25 21:48:27 +00:00
|
|
|
style.id = style.id || event.target.result;
|
|
|
|
invalidateCache(existed ? {updated: style} : {added: style});
|
|
|
|
if (notify) {
|
|
|
|
notifyAllTabs({
|
|
|
|
method: existed ? 'styleUpdated' : 'styleAdded',
|
|
|
|
style, codeIsUpdated, reason,
|
|
|
|
});
|
|
|
|
}
|
2017-08-05 16:49:25 +00:00
|
|
|
if (style.usercss && !existed && reason === 'install') {
|
|
|
|
// open the editor for usercss with the first install?
|
|
|
|
openEditor(style.id);
|
|
|
|
}
|
2017-04-25 21:48:27 +00:00
|
|
|
return style;
|
|
|
|
}
|
2015-01-30 17:07:24 +00:00
|
|
|
}
|
|
|
|
|
Improve style caching, cache requests too, add code:false mode
Previously, when a cache was invalidated and every tab/iframe issued a getStyles request, we previous needlessly accessed IndexedDB for each of these requests. It happened because 1) the global cachedStyles was created only at the end of the async DB-reading, 2) and each style record is retrieved asynchronously so the single threaded JS engine interleaved all these operations. It could easily span a few seconds when many tabs are open and you have like 100 styles.
Now, in getStyles: all requests issued while cachedStyles is being populated are queued and invoked at the end.
Now, in filterStyles: all requests are cached using the request's options combined in a string as a key. It also helps on each navigation because we monitor page loading process at different stages: before, when committed, history traversal, requesting applicable styles by a content script. Icon badge update also may issue a copy of the just issued request by one of the navigation listeners.
Now, the caches are invalidated smartly: style add/update/delete/toggle only purges filtering cache, and modifies style cache in-place without re-reading the entire IndexedDB.
Now, code:false mode for manage page that only needs style meta. It reduces the transferred message size 10-100 times thus reducing the overhead caused by to internal JSON-fication in the extensions API.
Also fast&direct getStylesSafe for own pages; code cosmetics
2017-03-17 22:50:35 +00:00
|
|
|
|
2017-04-11 10:51:40 +00:00
|
|
|
function deleteStyle({id, notify = true}) {
|
2017-04-25 21:48:27 +00:00
|
|
|
id = Number(id);
|
|
|
|
return dbExec('delete', id).then(() => {
|
|
|
|
invalidateCache({deletedId: id});
|
|
|
|
if (notify) {
|
|
|
|
notifyAllTabs({method: 'styleDeleted', id});
|
|
|
|
}
|
|
|
|
return id;
|
|
|
|
});
|
2015-01-30 17:07:24 +00:00
|
|
|
}
|
|
|
|
|
2017-08-05 16:49:25 +00:00
|
|
|
function findDupUsercss(style) {
|
|
|
|
if (style.id) {
|
|
|
|
return getStyles({id: style.id}).then(s => s[0]);
|
|
|
|
}
|
|
|
|
return getStyles().then(styles =>
|
|
|
|
styles.find(
|
|
|
|
s => s.name === style.name && s.namespace === style.namespace
|
|
|
|
)
|
|
|
|
);
|
|
|
|
}
|
|
|
|
|
Improve style caching, cache requests too, add code:false mode
Previously, when a cache was invalidated and every tab/iframe issued a getStyles request, we previous needlessly accessed IndexedDB for each of these requests. It happened because 1) the global cachedStyles was created only at the end of the async DB-reading, 2) and each style record is retrieved asynchronously so the single threaded JS engine interleaved all these operations. It could easily span a few seconds when many tabs are open and you have like 100 styles.
Now, in getStyles: all requests issued while cachedStyles is being populated are queued and invoked at the end.
Now, in filterStyles: all requests are cached using the request's options combined in a string as a key. It also helps on each navigation because we monitor page loading process at different stages: before, when committed, history traversal, requesting applicable styles by a content script. Icon badge update also may issue a copy of the just issued request by one of the navigation listeners.
Now, the caches are invalidated smartly: style add/update/delete/toggle only purges filtering cache, and modifies style cache in-place without re-reading the entire IndexedDB.
Now, code:false mode for manage page that only needs style meta. It reduces the transferred message size 10-100 times thus reducing the overhead caused by to internal JSON-fication in the extensions API.
Also fast&direct getStylesSafe for own pages; code cosmetics
2017-03-17 22:50:35 +00:00
|
|
|
|
2017-08-16 17:40:24 +00:00
|
|
|
function getApplicableSections({
|
|
|
|
style,
|
|
|
|
matchUrl,
|
|
|
|
strictRegexp = true,
|
|
|
|
// filterStylesInternal() sets the following to avoid recalc on each style:
|
|
|
|
stopOnFirst,
|
|
|
|
skipUrlCheck,
|
|
|
|
matchUrlBase = matchUrl.includes('#') && matchUrl.split('#', 1)[0],
|
|
|
|
// as per spec the fragment portion is ignored in @-moz-document:
|
|
|
|
// https://www.w3.org/TR/2012/WD-css3-conditional-20120911/#url-of-doc
|
|
|
|
// but the spec is outdated and doesn't account for SPA sites
|
|
|
|
// so we only respect it in case of url("http://exact.url/without/hash")
|
|
|
|
}) {
|
|
|
|
if (!skipUrlCheck && !URLS.supported(matchUrl)) {
|
2017-04-13 21:44:23 +00:00
|
|
|
return [];
|
|
|
|
}
|
2017-03-26 07:19:47 +00:00
|
|
|
const sections = [];
|
|
|
|
for (const section of style.sections) {
|
2017-04-13 21:44:23 +00:00
|
|
|
const {urls, domains, urlPrefixes, regexps, code} = section;
|
2017-05-05 14:21:17 +00:00
|
|
|
const isGlobal = !urls.length && !urlPrefixes.length && !domains.length && !regexps.length;
|
|
|
|
const isMatching = !isGlobal && (
|
|
|
|
urls.length
|
2017-08-16 17:40:24 +00:00
|
|
|
&& (urls.includes(matchUrl) || matchUrlBase && urls.includes(matchUrlBase))
|
2017-04-24 13:29:48 +00:00
|
|
|
|| urlPrefixes.length
|
|
|
|
&& arraySomeIsPrefix(urlPrefixes, matchUrl)
|
|
|
|
|| domains.length
|
|
|
|
&& arraySomeIn(cachedStyles.urlDomains.get(matchUrl) || getDomains(matchUrl), domains)
|
|
|
|
|| regexps.length
|
2017-05-05 14:21:17 +00:00
|
|
|
&& arraySomeMatches(regexps, matchUrl, strictRegexp));
|
|
|
|
if (isGlobal && !styleCodeEmpty(code) || isMatching) {
|
2017-04-13 21:44:23 +00:00
|
|
|
sections.push(section);
|
|
|
|
if (stopOnFirst) {
|
|
|
|
break;
|
2017-03-28 08:24:31 +00:00
|
|
|
}
|
2017-04-13 21:44:23 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
return sections;
|
|
|
|
|
|
|
|
function arraySomeIsPrefix(array, string) {
|
|
|
|
for (const prefix of array) {
|
|
|
|
if (string.startsWith(prefix)) {
|
|
|
|
return true;
|
2017-03-26 07:19:47 +00:00
|
|
|
}
|
2017-04-13 21:44:23 +00:00
|
|
|
}
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
|
|
|
|
function arraySomeIn(array, haystack) {
|
|
|
|
for (const el of array) {
|
|
|
|
if (haystack.indexOf(el) >= 0) {
|
|
|
|
return true;
|
2017-03-28 08:24:31 +00:00
|
|
|
}
|
2017-04-13 21:44:23 +00:00
|
|
|
}
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
|
|
|
|
function arraySomeMatches(array, matchUrl, strictRegexp) {
|
|
|
|
for (const regexp of array) {
|
|
|
|
for (let pass = 1; pass <= (strictRegexp ? 1 : 2); pass++) {
|
2017-07-16 18:02:00 +00:00
|
|
|
const cacheKey = pass === 1 ? regexp : SLOPPY_REGEXP_PREFIX + regexp;
|
2017-04-13 21:44:23 +00:00
|
|
|
let rx = cachedStyles.regexps.get(cacheKey);
|
2017-07-16 18:02:00 +00:00
|
|
|
if (rx === false) {
|
2017-04-13 21:44:23 +00:00
|
|
|
// invalid regexp
|
|
|
|
break;
|
2017-03-30 23:18:41 +00:00
|
|
|
}
|
2017-04-13 21:44:23 +00:00
|
|
|
if (!rx) {
|
2017-07-16 18:02:00 +00:00
|
|
|
const anchored = pass === 1 ? '^(?:' + regexp + ')$' : '^' + regexp + '$';
|
2017-04-13 21:44:23 +00:00
|
|
|
rx = tryRegExp(anchored);
|
|
|
|
cachedStyles.regexps.set(cacheKey, rx || false);
|
|
|
|
if (!rx) {
|
2017-03-30 23:18:41 +00:00
|
|
|
// invalid regexp
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
}
|
2017-04-13 21:44:23 +00:00
|
|
|
if (rx.test(matchUrl)) {
|
|
|
|
return true;
|
|
|
|
}
|
2017-03-28 08:24:31 +00:00
|
|
|
}
|
2017-03-26 10:05:05 +00:00
|
|
|
}
|
2017-04-13 21:44:23 +00:00
|
|
|
return false;
|
2017-03-26 10:05:05 +00:00
|
|
|
}
|
2017-04-13 21:44:23 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
function styleCodeEmpty(code) {
|
2017-05-05 14:21:17 +00:00
|
|
|
// Collect the global section if it's not empty, not comment-only, not namespace-only.
|
|
|
|
const cmtOpen = code && code.indexOf('/*');
|
|
|
|
if (cmtOpen >= 0) {
|
|
|
|
const cmtCloseLast = code.lastIndexOf('*/');
|
|
|
|
if (cmtCloseLast < 0) {
|
|
|
|
code = code.substr(0, cmtOpen);
|
|
|
|
} else {
|
|
|
|
code = code.substr(0, cmtOpen) +
|
|
|
|
code.substring(cmtOpen, cmtCloseLast + 2).replace(RX_CSS_COMMENTS, '') +
|
|
|
|
code.substr(cmtCloseLast + 2);
|
|
|
|
}
|
2017-04-13 21:44:23 +00:00
|
|
|
}
|
2017-05-05 14:21:17 +00:00
|
|
|
return !code
|
|
|
|
|| !code.trim()
|
|
|
|
|| code.includes('@namespace') && !code.replace(RX_NAMESPACE, '').trim();
|
2016-03-07 02:27:17 +00:00
|
|
|
}
|
|
|
|
|
Improve style caching, cache requests too, add code:false mode
Previously, when a cache was invalidated and every tab/iframe issued a getStyles request, we previous needlessly accessed IndexedDB for each of these requests. It happened because 1) the global cachedStyles was created only at the end of the async DB-reading, 2) and each style record is retrieved asynchronously so the single threaded JS engine interleaved all these operations. It could easily span a few seconds when many tabs are open and you have like 100 styles.
Now, in getStyles: all requests issued while cachedStyles is being populated are queued and invoked at the end.
Now, in filterStyles: all requests are cached using the request's options combined in a string as a key. It also helps on each navigation because we monitor page loading process at different stages: before, when committed, history traversal, requesting applicable styles by a content script. Icon badge update also may issue a copy of the just issued request by one of the navigation listeners.
Now, the caches are invalidated smartly: style add/update/delete/toggle only purges filtering cache, and modifies style cache in-place without re-reading the entire IndexedDB.
Now, code:false mode for manage page that only needs style meta. It reduces the transferred message size 10-100 times thus reducing the overhead caused by to internal JSON-fication in the extensions API.
Also fast&direct getStylesSafe for own pages; code cosmetics
2017-03-17 22:50:35 +00:00
|
|
|
|
2017-04-13 21:49:18 +00:00
|
|
|
function styleSectionsEqual({sections: a}, {sections: b}) {
|
|
|
|
if (!a || !b) {
|
2017-03-26 02:30:59 +00:00
|
|
|
return undefined;
|
|
|
|
}
|
2017-07-16 18:02:00 +00:00
|
|
|
if (a.length !== b.length) {
|
2017-03-26 02:30:59 +00:00
|
|
|
return false;
|
|
|
|
}
|
2017-04-13 21:49:18 +00:00
|
|
|
const checkedInB = [];
|
|
|
|
return a.every(sectionA => b.some(sectionB => {
|
|
|
|
if (!checkedInB.includes(sectionB) && propertiesEqual(sectionA, sectionB)) {
|
|
|
|
checkedInB.push(sectionB);
|
|
|
|
return true;
|
2017-03-26 02:30:59 +00:00
|
|
|
}
|
2017-04-13 21:49:18 +00:00
|
|
|
}));
|
|
|
|
|
|
|
|
function propertiesEqual(secA, secB) {
|
|
|
|
for (const name of ['urlPrefixes', 'urls', 'domains', 'regexps']) {
|
|
|
|
if (!equalOrEmpty(secA[name], secB[name], 'every', arrayMirrors)) {
|
|
|
|
return false;
|
2017-03-26 02:30:59 +00:00
|
|
|
}
|
|
|
|
}
|
2017-07-16 18:02:00 +00:00
|
|
|
return equalOrEmpty(secA.code, secB.code, 'substr', (a, b) => a === b);
|
2017-04-13 21:49:18 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
function equalOrEmpty(a, b, telltale, comparator) {
|
2017-07-16 18:02:00 +00:00
|
|
|
const typeA = a && typeof a[telltale] === 'function';
|
|
|
|
const typeB = b && typeof b[telltale] === 'function';
|
2017-04-13 21:49:18 +00:00
|
|
|
return (
|
|
|
|
(a === null || a === undefined || (typeA && !a.length)) &&
|
|
|
|
(b === null || b === undefined || (typeB && !b.length))
|
2017-07-16 18:02:00 +00:00
|
|
|
) || typeA && typeB && a.length === b.length && comparator(a, b);
|
2017-04-13 21:49:18 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
function arrayMirrors(array1, array2) {
|
|
|
|
for (const el of array1) {
|
|
|
|
if (array2.indexOf(el) < 0) {
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
for (const el of array2) {
|
|
|
|
if (array1.indexOf(el) < 0) {
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
return true;
|
2017-03-26 02:30:59 +00:00
|
|
|
}
|
2017-03-15 11:37:29 +00:00
|
|
|
}
|
2017-03-26 07:19:47 +00:00
|
|
|
|
|
|
|
|
2017-04-13 16:44:43 +00:00
|
|
|
function invalidateCache({added, updated, deletedId} = {}) {
|
2017-04-11 10:51:40 +00:00
|
|
|
if (!cachedStyles.list) {
|
|
|
|
return;
|
|
|
|
}
|
2017-04-19 16:03:00 +00:00
|
|
|
const id = added ? added.id : updated ? updated.id : deletedId;
|
|
|
|
const cached = cachedStyles.byId.get(id);
|
2017-04-11 10:51:40 +00:00
|
|
|
if (updated) {
|
|
|
|
if (cached) {
|
|
|
|
Object.assign(cached, updated);
|
2017-04-19 16:03:00 +00:00
|
|
|
cachedStyles.filters.clear();
|
2017-09-03 08:12:18 +00:00
|
|
|
cachedStyles.needTransitionPatch.delete(id);
|
2017-04-19 16:03:00 +00:00
|
|
|
return;
|
|
|
|
} else {
|
|
|
|
added = updated;
|
2017-04-11 10:51:40 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
if (added) {
|
2017-04-19 16:03:00 +00:00
|
|
|
if (!cached) {
|
|
|
|
cachedStyles.list.push(added);
|
|
|
|
cachedStyles.byId.set(added.id, added);
|
|
|
|
cachedStyles.filters.clear();
|
2017-09-03 08:12:18 +00:00
|
|
|
cachedStyles.needTransitionPatch.delete(id);
|
2017-04-19 16:03:00 +00:00
|
|
|
}
|
2017-04-11 10:51:40 +00:00
|
|
|
return;
|
|
|
|
}
|
2017-04-19 16:03:00 +00:00
|
|
|
if (deletedId !== undefined) {
|
|
|
|
if (cached) {
|
|
|
|
const cachedIndex = cachedStyles.list.indexOf(cached);
|
2017-04-11 10:51:40 +00:00
|
|
|
cachedStyles.list.splice(cachedIndex, 1);
|
|
|
|
cachedStyles.byId.delete(deletedId);
|
|
|
|
cachedStyles.filters.clear();
|
2017-09-03 08:12:18 +00:00
|
|
|
cachedStyles.needTransitionPatch.delete(id);
|
2017-04-11 10:51:40 +00:00
|
|
|
return;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
cachedStyles.list = null;
|
|
|
|
cachedStyles.filters.clear();
|
2017-09-03 08:12:18 +00:00
|
|
|
cachedStyles.needTransitionPatch.clear(id);
|
2017-04-11 10:51:40 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
function cleanupCachedFilters({force = false} = {}) {
|
|
|
|
if (!force) {
|
2017-04-13 16:44:43 +00:00
|
|
|
debounce(cleanupCachedFilters, 1000, {force: true});
|
2017-04-11 10:51:40 +00:00
|
|
|
return;
|
|
|
|
}
|
|
|
|
const size = cachedStyles.filters.size;
|
|
|
|
const oldestHit = cachedStyles.filters.values().next().value.lastHit;
|
|
|
|
const now = Date.now();
|
|
|
|
const timeSpan = now - oldestHit;
|
|
|
|
const recencyWeight = 5 / size;
|
2017-08-21 18:58:24 +00:00
|
|
|
const hitWeight = 1 / 4; // we make ~4 hits per URL
|
2017-04-11 10:51:40 +00:00
|
|
|
const lastHitWeight = 10;
|
|
|
|
// delete the oldest 10%
|
|
|
|
[...cachedStyles.filters.entries()]
|
|
|
|
.map(([id, v], index) => ({
|
|
|
|
id,
|
|
|
|
weight:
|
|
|
|
index * recencyWeight +
|
|
|
|
v.hits * hitWeight +
|
|
|
|
(v.lastHit - oldestHit) / timeSpan * lastHitWeight,
|
|
|
|
}))
|
|
|
|
.sort((a, b) => a.weight - b.weight)
|
|
|
|
.slice(0, size / 10 + 1)
|
|
|
|
.forEach(({id}) => cachedStyles.filters.delete(id));
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
function getDomains(url) {
|
2017-08-26 04:57:52 +00:00
|
|
|
let d = /.*?:\/*([^/:]+)|$/.exec(url)[1];
|
|
|
|
if (!d || url.startsWith('file:')) {
|
2017-04-11 10:51:40 +00:00
|
|
|
return [];
|
|
|
|
}
|
|
|
|
const domains = [d];
|
2017-07-16 18:02:00 +00:00
|
|
|
while (d.indexOf('.') !== -1) {
|
2017-04-11 10:51:40 +00:00
|
|
|
d = d.substring(d.indexOf('.') + 1);
|
|
|
|
domains.push(d);
|
|
|
|
}
|
|
|
|
return domains;
|
|
|
|
}
|
2017-04-23 12:19:18 +00:00
|
|
|
|
|
|
|
|
2017-04-24 13:29:48 +00:00
|
|
|
function normalizeStyleSections({sections}) {
|
|
|
|
// retain known properties in an arbitrarily predefined order
|
|
|
|
return (sections || []).map(section => ({
|
|
|
|
code: section.code || '',
|
|
|
|
urls: section.urls || [],
|
|
|
|
urlPrefixes: section.urlPrefixes || [],
|
|
|
|
domains: section.domains || [],
|
|
|
|
regexps: section.regexps || [],
|
|
|
|
}));
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
function calcStyleDigest(style) {
|
|
|
|
const jsonString = JSON.stringify(normalizeStyleSections(style));
|
|
|
|
const text = new TextEncoder('utf-8').encode(jsonString);
|
2017-04-23 12:19:18 +00:00
|
|
|
return crypto.subtle.digest('SHA-1', text).then(hex);
|
2017-04-24 13:29:48 +00:00
|
|
|
|
2017-04-23 12:19:18 +00:00
|
|
|
function hex(buffer) {
|
|
|
|
const parts = [];
|
|
|
|
const PAD8 = '00000000';
|
|
|
|
const view = new DataView(buffer);
|
|
|
|
for (let i = 0; i < view.byteLength; i += 4) {
|
|
|
|
parts.push((PAD8 + view.getUint32(i).toString(16)).slice(-8));
|
|
|
|
}
|
|
|
|
return parts.join('');
|
|
|
|
}
|
|
|
|
}
|
2017-09-03 08:12:18 +00:00
|
|
|
|
|
|
|
|
2017-09-03 20:52:06 +00:00
|
|
|
function handleCssTransitionBug({tabId, frameId, url, styles}) {
|
2017-09-03 08:12:18 +00:00
|
|
|
for (let id in styles) {
|
|
|
|
id |= 0;
|
|
|
|
if (!id) {
|
|
|
|
continue;
|
|
|
|
}
|
|
|
|
let need = cachedStyles.needTransitionPatch.get(id);
|
|
|
|
if (need === false) {
|
|
|
|
continue;
|
|
|
|
}
|
|
|
|
if (need !== true) {
|
|
|
|
need = styles[id].some(sectionContainsTransitions);
|
|
|
|
cachedStyles.needTransitionPatch.set(id, need);
|
|
|
|
if (!need) {
|
|
|
|
continue;
|
|
|
|
}
|
|
|
|
}
|
2017-09-03 20:52:06 +00:00
|
|
|
if (FIREFOX && !url.startsWith(URLS.ownOrigin)) {
|
2017-09-03 08:12:18 +00:00
|
|
|
patchFirefox();
|
|
|
|
} else {
|
|
|
|
styles.needTransitionPatch = true;
|
|
|
|
}
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
|
|
|
|
function patchFirefox() {
|
|
|
|
browser.tabs.insertCSS(tabId, {
|
|
|
|
frameId,
|
|
|
|
code: CSS_TRANSITION_SUPPRESSOR,
|
|
|
|
cssOrigin: 'user',
|
|
|
|
runAt: 'document_start',
|
|
|
|
matchAboutBlank: true,
|
|
|
|
}).then(() => setTimeout(() => {
|
|
|
|
browser.tabs.removeCSS(tabId, {
|
|
|
|
frameId,
|
|
|
|
code: CSS_TRANSITION_SUPPRESSOR,
|
|
|
|
cssOrigin: 'user',
|
|
|
|
matchAboutBlank: true,
|
|
|
|
}).catch(ignoreChromeError);
|
|
|
|
})).catch(ignoreChromeError);
|
|
|
|
}
|
|
|
|
|
|
|
|
function sectionContainsTransitions(section) {
|
|
|
|
let code = section.code;
|
|
|
|
const firstTransition = code.indexOf('transition');
|
|
|
|
if (firstTransition < 0) {
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
const firstCmt = code.indexOf('/*');
|
|
|
|
// check the part before the first comment
|
|
|
|
if (firstCmt < 0 || firstTransition < firstCmt) {
|
|
|
|
if (quickCheckAround(code, firstTransition)) {
|
|
|
|
return true;
|
|
|
|
} else if (firstCmt < 0) {
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
// check the rest
|
|
|
|
const lastCmt = code.lastIndexOf('*/');
|
|
|
|
if (lastCmt < firstCmt) {
|
|
|
|
// the comment is unclosed and we already checked the preceding part
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
let mid = code.slice(firstCmt, lastCmt + 2);
|
|
|
|
mid = mid.indexOf('*/') === mid.length - 2 ? '' : mid.replace(RX_CSS_COMMENTS, '');
|
|
|
|
code = mid + code.slice(lastCmt + 2);
|
|
|
|
return quickCheckAround(code) || RX_CSS_TRANSITION_DETECTOR.test(code);
|
|
|
|
}
|
|
|
|
|
|
|
|
function quickCheckAround(code, pos = code.indexOf('transition')) {
|
|
|
|
return RX_CSS_TRANSITION_DETECTOR.test(code.substr(Math.max(0, pos - 10), 50));
|
|
|
|
}
|
|
|
|
}
|