diff --git a/background/usercss-manager.js b/background/usercss-manager.js index a1ae635c..f54f463c 100644 --- a/background/usercss-manager.js +++ b/background/usercss-manager.js @@ -40,13 +40,15 @@ const usercssMan = { const style = await usercssMan.buildMeta({sourceCode}); const dup = (checkDup || assignVars) && await usercssMan.find(styleId ? {id: styleId} : style); + let log; if (!metaOnly) { if (vars || assignVars) { await usercssMan.assignVars(style, vars ? {usercssData: {vars}} : dup); } await usercssMan.buildCode(style); + log = style.log; // extracting the non-enumerable prop, otherwise it won't survive messaging } - return {style, dup}; + return {style, dup, log}; }, async buildCode(style) { @@ -55,12 +57,14 @@ const usercssMan = { const i = match.index; const j = i + match[0].length; const codeNoMeta = code.slice(0, i) + blankOut(code, i, j) + code.slice(j); - const {sections, errors} = await API.worker.compileUsercss(preprocessor, codeNoMeta, vars); + const {sections, errors, log} = await API.worker.compileUsercss(preprocessor, codeNoMeta, vars); const recoverable = errors.every(e => e.recoverable); if (!sections.length || !recoverable) { throw !recoverable ? errors : 'Style does not contain any actual CSS to apply.'; } style.sections = sections; + // adding a non-enumerable prop so it won't be written to storage + if (log) Object.defineProperty(style, 'log', {value: log}); return style; }, @@ -111,7 +115,11 @@ const usercssMan = { }, async editSave(style) { - return API.styles.editSave(await usercssMan.parse(style)); + style = await usercssMan.parse(style); + return { + log: style.log, // extracting the non-enumerable prop, otherwise it won't survive messaging + style: await API.styles.editSave(style), + }; }, async find(styleOrData) { diff --git a/edit/source-editor.js b/edit/source-editor.js index bc8a9f30..68cb7d95 100644 --- a/edit/source-editor.js +++ b/edit/source-editor.js @@ -63,13 +63,14 @@ function SourceEditor() { const sourceCode = cm.getValue(); try { const {customName, enabled, id} = style; - if (!id && - (await API.usercss.build({sourceCode, checkDup: true, metaOnly: true})).dup) { + let res = !id && await API.usercss.build({sourceCode, checkDup: true, metaOnly: true}); + if (res && res.dup) { messageBoxProxy.alert(t('usercssAvoidOverwriting'), 'danger', t('genericError')); } else { - await replaceStyle( - await API.usercss.editSave({customName, enabled, id, sourceCode})); + res = await API.usercss.editSave({customName, enabled, id, sourceCode}); + await replaceStyle(res.style); } + showLog(res); } catch (err) { const i = err.index; const isNameEmpty = i > 0 && @@ -111,13 +112,20 @@ function SourceEditor() { } async function preprocess(style) { - const {style: newStyle} = await API.usercss.build({ + const res = await API.usercss.build({ styleId: style.id, sourceCode: style.sourceCode, assignVars: true, }); - delete newStyle.enabled; - return Object.assign(style, newStyle); + showLog(res); + delete res.style.enabled; + return Object.assign(style, res.style); + } + + /** Shows the console.log output from the background worker stored in `log` property */ + function showLog(data) { + if (data.log) data.log.forEach(args => console.log(...args)); + return data; } function updateLivePreview() { diff --git a/js/usercss-compiler.js b/js/usercss-compiler.js index ae9c2c78..9440a44a 100644 --- a/js/usercss-compiler.js +++ b/js/usercss-compiler.js @@ -1,5 +1,7 @@ 'use strict'; +let builderChain = Promise.resolve(); + const BUILDERS = Object.assign(Object.create(null), { default: { @@ -114,14 +116,25 @@ async function compileUsercss(preprocessor, code, vars) { } else { vars = {}; } + const log = []; if (builder.pre) { - code = await builder.pre(code, vars); + // another compileUsercss may(?) become active while this one is awaited so let's chain + builderChain = builderChain.catch(() => {}).then(async () => { + const logFn = console.log; + console.log = (...args) => log.push(args); + code = await builder.pre(code, vars); + console.log = logFn; + }); + await builderChain; } require(['/js/moz-parser']); /* global extractSections */ const res = extractSections({code}); if (builder.post) { builder.post(res.sections, vars); } + if (log.length) { + res.log = log; + } return res; }