diff --git a/src/style-manager.js b/src/style-manager.js index a294d1d15..0b139514c 100644 --- a/src/style-manager.js +++ b/src/style-manager.js @@ -17,6 +17,7 @@ module.exports = class StyleManager { this.emitter = new Emitter() this.styleElements = [] this.styleElementsBySourcePath = {} + this.deprecationsBySourcePath = {} } /* @@ -93,6 +94,10 @@ module.exports = class StyleManager { return this.emitter.on('did-update-style-element', callback) } + onDidUpdateDeprecations (callback) { + return this.emitter.on('did-update-deprecations', callback) + } + /* Section: Reading Style Elements */ @@ -125,7 +130,12 @@ module.exports = class StyleManager { } } - styleElement.textContent = transformDeprecatedShadowDOMSelectors(source, params.context) + const transformed = transformDeprecatedShadowDOMSelectors(source, params.context) + styleElement.textContent = transformed.source + if (transformed.deprecationMessage) { + this.deprecationsBySourcePath[params.sourcePath] = {message: transformed.deprecationMessage} + this.emitter.emit('did-update-deprecations') + } if (updated) { this.emitter.emit('did-update-style-element', styleElement) } else { @@ -163,6 +173,14 @@ module.exports = class StyleManager { } } + getDeprecations () { + return this.deprecationsBySourcePath + } + + clearDeprecations () { + this.deprecationsBySourcePath = {} + } + getSnapshot () { return this.styleElements.slice() } @@ -210,9 +228,10 @@ module.exports = class StyleManager { } function transformDeprecatedShadowDOMSelectors (css, context) { - const root = postcss.parse(css) - root.walkRules((rule) => { - rule.selector = selectorParser((selectors) => { + const transformedSelectors = [] + const transformedSource = postcss.parse(css) + transformedSource.walkRules((rule) => { + const transformedSelector = selectorParser((selectors) => { selectors.each((selector) => { const firstNode = selector.nodes[0] if (context === 'atom-text-editor' && firstNode.type === 'pseudo' && firstNode.value === ':host') { @@ -238,7 +257,23 @@ function transformDeprecatedShadowDOMSelectors (css, context) { previousNode = node }) }) - }).process(rule.selector).result + }).process(rule.selector, {lossless: true}).result + if (transformedSelector !== rule.selector) { + transformedSelectors.push({before: rule.selector, after: transformedSelector}) + rule.selector = transformedSelector + } }) - return root.toString() + let deprecationMessage + if (transformedSelectors.length > 0) { + deprecationMessage = 'Shadow DOM support for \`atom-text-editor\` elements has been deprecated. ' + deprecationMessage += 'This means you should stop using \`:host\` and \`::shadow\` ' + deprecationMessage += 'pseudo-selectors, and prepend all your syntax selectors with \`syntax--\`. ' + deprecationMessage += 'To prevent breakage with existing stylesheets, Atom will automatically ' + deprecationMessage += 'upgrade the following selectors:\n\n' + deprecationMessage += transformedSelectors + .map((selector) => `* \`${selector.before}\` => \`${selector.after}\``) + .join('\n\n') + '\n\n' + deprecationMessage += 'Please, make sure to upgrade these selectors as soon as possible.' + } + return {source: transformedSource.toString(), deprecationMessage} }