Deprecation message from v1.13.0


#1

My Deprecation Cop has been complaining about this package:

The message is:

Starting from Atom v1.13.0, the contents of atom-text-editor elements are no longer encapsulated within a shadow DOM boundary. This means you should stop using :host and ::shadow pseudo-selectors, and prepend all your syntax selectors with syntax–. To prevent breakage with existing style sheets, Atom will automatically upgrade the following selectors:

.atom-text-editor, :host => .atom-text-editor,atom-text-editor .atom-text-editor, :host => .atom-text-editor,atom-text-editor .atom-text-editor .wrap-guide, :host .wrap-guide => .atom-text-editor .wrap-guide,atom-text-editor .wrap-guide .atom-text-editor .indent-guide, :host .indent-guide => .atom-text-editor .indent-guide,atom-text-editor .indent-guide .atom-text-editor .invisible-character, :host .invisible-character => .atom-text-editor .invisible-character,atom-text-editor .invisible-character .atom-text-editor .gutter, :host .gutter => .atom-text-editor .gutter,atom-text-editor .gutter .atom-text-editor .gutter .line-number, :host .gutter .line-number => .atom-text-editor .gutter .line-number,atom-text-editor .gutter .line-number .atom-text-editor .gutter .line-number.cursor-line, :host .gutter .line-number.cursor-line => .atom-text-editor .gutter .line-number.cursor-line,atom-text-editor .gutter .line-number.cursor-line .atom-text-editor .gutter .line-number.cursor-line-no-selection, :host .gutter .line-number.cursor-line-no-selection => .atom-text-editor .gutter .line-number.cursor-line-no-selection,atom-text-editor .gutter .line-number.cursor-line-no-selection .atom-text-editor .gutter .line-number:hover, :host .gutter .line-number:hover => .atom-text-editor .gutter .line-number:hover,atom-text-editor .gutter .line-number:hover .atom-text-editor .gutter .line-number.folded, :host .gutter .line-number.folded, .atom-text-editor .gutter .line-number:after, :host .gutter .line-number:after, .atom-text-editor .fold-marker:after, :host .fold-marker:after => .atom-text-editor .gutter .line-number.folded,atom-text-editor .gutter .line-number.folded, .atom-text-editor .gutter .line-number:after,atom-text-editor .gutter .line-number:after, .atom-text-editor .fold-marker:after,atom-text-editor .fold-marker:after .atom-text-editor .invisible, :host .invisible => .atom-text-editor .invisible,atom-text-editor .invisible .atom-text-editor .cursor, :host .cursor => .atom-text-editor .cursor,atom-text-editor .cursor .atom-text-editor .selection .region, :host .selection .region => .atom-text-editor .selection .region,atom-text-editor .selection .region .atom-text-editor .scroll-view, :host .scroll-view => .atom-text-editor .scroll-view,atom-text-editor .scroll-view .atom-text-editor .line.cursor-line, :host .line.cursor-line => .atom-text-editor .line.cursor-line,atom-text-editor .line.cursor-line .comment => .syntax--comment .keyword => .syntax--keyword .keyword.control => .syntax--keyword.syntax--control .keyword.operator => .syntax--keyword.syntax--operator .keyword.other.special-method => .syntax--keyword.syntax--other.syntax--special-method .keyword.other.unit => .syntax--keyword.syntax--other.syntax--unit .storage => .syntax--storage .storage.modifier => .syntax--storage.syntax--modifier .constant => .syntax--constant .constant.character.escape => .syntax--constant.syntax--character.syntax--escape .constant.numeric => .syntax--constant.syntax--numeric .constant.other.color => .syntax--constant.syntax--other.syntax--color .constant.other.symbol => .syntax--constant.syntax--other.syntax--symbol .variable => .syntax--variable .variable.interpolation => .syntax--variable.syntax--interpolation .variable.parameter.function => .syntax--variable.syntax--parameter.syntax--function .invalid.illegal, .invalid.deprecated => .syntax--invalid.syntax--illegal, .syntax--invalid.syntax--deprecated .string => .syntax--string .string .constant => .syntax--string .syntax--constant .string.regexp => .syntax--string.syntax--regexp .string.regexp .constant.character.escape, .string.regexp .source.ruby.embedded, .string.regexp .string.regexp.arbitrary-repitition => .syntax--string.syntax--regexp .syntax--constant.syntax--character.syntax--escape, .syntax--string.syntax--regexp .syntax--source.syntax--ruby.syntax--embedded, .syntax--string.syntax--regexp .syntax--string.syntax--regexp.syntax--arbitrary-repitition .string.regexp.group => .syntax--string.syntax--regexp.syntax--group .string.regexp.character-class => .syntax--string.syntax--regexp.syntax--character-class .string.regexp .source.ruby.embedded => .syntax--string.syntax--regexp .syntax--source.syntax--ruby.syntax--embedded .string .variable => .syntax--string .syntax--variable .string.other.link => .syntax--string.syntax--other.syntax--link .source .string .source, .source .string .meta.embedded.line => .syntax--source .syntax--string .syntax--source, .syntax--source .syntax--string .syntax--meta.syntax--embedded.line .source .string .punctuation.section.embedded => .syntax--source .syntax--string .syntax--punctuation.syntax--section.syntax--embedded .source .string .punctuation.section.embedded .source => .syntax--source .syntax--string .syntax--punctuation.syntax--section.syntax--embedded .syntax--source .punctuation.terminator => .syntax--punctuation.syntax--terminator .punctuation.separator => .syntax--punctuation.syntax--separator .punctuation.definition => .syntax--punctuation.syntax--definition .punctuation.definition.comment => .syntax--punctuation.syntax--definition.syntax--comment .punctuation.definition.string, .punctuation.definition.variable, .punctuation.definition.array => .syntax--punctuation.syntax--definition.syntax--string, .syntax--punctuation.syntax--definition.syntax--variable, .syntax--punctuation.syntax--definition.syntax--array .punctuation.definition.parameters => .syntax--punctuation.syntax--definition.syntax--parameters .punctuation.definition.heading, .punctuation.definition.identity => .syntax--punctuation.syntax--definition.syntax--heading, .syntax--punctuation.syntax--definition.syntax--identity .punctuation.definition.bold => .syntax--punctuation.syntax--definition.syntax--bold .punctuation.definition.italic => .syntax--punctuation.syntax--definition.syntax--italic .punctuation.section.embedded => .syntax--punctuation.syntax--section.syntax--embedded .support => .syntax--support .support.class => .syntax--support.syntax--class .support.function => .syntax--support.syntax--function .support.function.any-method => .syntax--support.syntax--function.syntax--any-method .support.constant => .syntax--support.syntax--constant .support.type.property-name.css => .syntax--support.syntax--type.syntax--property-name.syntax--css .source .entity.name.tag, .source .entity.other.attribute-name, .meta.tag.inline, .meta.tag.inline .entity => .syntax--source .syntax--entity.syntax--name.syntax--tag, .syntax--source .syntax--entity.syntax--other.syntax--attribute-name, .syntax--meta.syntax--tag.syntax--inline, .syntax--meta.syntax--tag.syntax--inline .syntax--entity .tag, .tag .entity => .syntax--tag, .syntax--tag .syntax--entity .html .string => .syntax--html .syntax--string .html .punctuation.definition.tag => .syntax--html .syntax--punctuation.syntax--definition.syntax--tag .html .entity.name.tag => .syntax--html .syntax--entity.syntax--name.syntax--tag .html .entity.name.tag.structure => .syntax--html .syntax--entity.syntax--name.syntax--tag.syntax--structure .html .entity.name.tag.block => .syntax--html .syntax--entity.syntax--name.syntax--tag.syntax--block .html .entity.other.attribute-name => .syntax--html .syntax--entity.syntax--other.syntax--attribute-name .entity => .syntax--entity .entity.name.type => .syntax--entity.syntax--name.syntax--type .entity.other.inherited-class => .syntax--entity.syntax--other.syntax--inherited-class .entity.name.function => .syntax--entity.syntax--name.syntax--function .entity.name.class, .entity.name.type.class => .syntax--entity.syntax--name.syntax--class, .syntax--entity.syntax--name.syntax--type.syntax--class .entity.name.section => .syntax--entity.syntax--name.syntax--section .entity.name.tag => .syntax--entity.syntax--name.syntax--tag .entity.other.attribute-name => .syntax--entity.syntax--other.syntax--attribute-name .entity.other.attribute-name.id => .syntax--entity.syntax--other.syntax--attribute-name.syntax--id .meta.link => .syntax--meta.syntax--link .meta.require => .syntax--meta.syntax--require .meta.brace.curly => .syntax--meta.syntax--brace.syntax--curly .meta.brace.round => .syntax--meta.syntax--brace.syntax--round .meta.comma => .syntax--meta.syntax--comma .meta.selector => .syntax--meta.syntax--selector .meta.separator => .syntax--meta.syntax--separator .none => .syntax--none .markup.bold => .syntax--markup.syntax--bold .markup.changed => .syntax--markup.syntax--changed .markup.deleted => .syntax--markup.syntax--deleted .markup.italic => .syntax--markup.syntax--italic .markup.heading .punctuation.definition.heading => .syntax--markup.syntax--heading .syntax--punctuation.syntax--definition.syntax--heading .markup.inserted => .syntax--markup.syntax--inserted .markup.list => .syntax--markup.syntax--list .markup.quote => .syntax--markup.syntax--quote .markup.raw.inline => .syntax--markup.syntax--raw.syntax--inline .source.gfm .markup => .syntax--source.syntax--gfm .syntax--markup .source.gfm .markup.heading => .syntax--source.syntax--gfm .syntax--markup.syntax--heading atom-text-editor[mini] .scroll-view, :host(.mini) .scroll-view => atom-text-editor[mini] .scroll-view,atom-text-editor .scroll-view .html .meta.tag.any => .syntax--html .syntax--meta.syntax--tag.syntax--any .html .entity.name.tag.block, .html .entity.name.tag.inline, .html .entity.name.tag.name => .syntax--html .syntax--entity.syntax--name.syntax--tag.syntax--block, .syntax--html .syntax--entity.syntax--name.syntax--tag.syntax--inline, .syntax--html .syntax--entity.syntax--name.syntax--tag.syntax--name .html .entity.other.attribute-name.id.html => .syntax--html .syntax--entity.syntax--other.syntax--attribute-name.syntax--id.syntax--html .html .punctuation.separator.key-value => .syntax--html .syntax--punctuation.syntax--separator.syntax--key-value .html .string.quoted.double => .syntax--html .syntax--string.syntax--quoted.syntax--double .html .string.quoted.double .punctuation.definition.string.begin, .html .string.quoted.double .punctuation.definition.string.end => .syntax--html .syntax--string.syntax--quoted.syntax--double .syntax--punctuation.syntax--definition.syntax--string.syntax--begin, .syntax--html .syntax--string.syntax--quoted.syntax--double .syntax--punctuation.syntax--definition.syntax--string.syntax--end .html .string.quoted.double .punctuation.definition.string .separator.key-value.html => .syntax--html .syntax--string.syntax--quoted.syntax--double .syntax--punctuation.syntax--definition.syntax--string .syntax--separator.syntax--key-value.syntax--html .jade => .syntax--jade .jade .comment.jade => .syntax--jade .syntax--comment.syntax--jade .jade .storage.type.function.jade => .syntax--jade .syntax--storage.syntax--type.syntax--function.syntax--jade .jade .meta.control.flow.jade => .syntax--jade .syntax--meta.syntax--control.syntax--flow.syntax--jade .jade .source.script .meta.brace.round.js, .jade .source.script .meta.brace.curly.js => .syntax--jade .syntax--source.syntax--script .syntax--meta.syntax--brace.syntax--round.syntax--js, .syntax--jade .syntax--source.syntax--script .syntax--meta.syntax--brace.syntax--curly.syntax--js .jade .entity.name.tag.jade => .syntax--jade .syntax--entity.syntax--name.syntax--tag.syntax--jade .jade .storage.type.import.include.jade => .syntax--jade .syntax--storage.syntax--type.syntax--import.syntax--include.syntax--jade .jade .variable.control.import.include.jade => .syntax--jade .syntax--variable.syntax--control.syntax--import.syntax--include.syntax--jade .jade .constant.id => .syntax--jade .syntax--constant.syntax--id .jade .constant.language.js => .syntax--jade .syntax--constant.syntax--language.syntax--js .jade .text.jade => .syntax--jade .syntax--text.syntax--jade .jade .punctuation.separator.key-value.jade => .syntax--jade .syntax--punctuation.syntax--separator.syntax--key-value.syntax--jade .jade .string.quoted.jade => .syntax--jade .syntax--string.syntax--quoted.syntax--jade .source.js .punctuation.section.embedded.js => .syntax--source.syntax--js .syntax--punctuation.syntax--section.syntax--embedded.syntax--js .source.json .meta.structure.dictionary.json > .string.quoted.json => .syntax--source.syntax--json .syntax--meta.syntax--structure.syntax--dictionary.syntax--json > .syntax--string.syntax--quoted.syntax--json .source.json .meta.structure.dictionary.json > .string.quoted.json > .punctuation.string => .syntax--source.syntax--json .syntax--meta.syntax--structure.syntax--dictionary.syntax--json > .syntax--string.syntax--quoted.syntax--json > .syntax--punctuation.syntax--string .source.json .meta.structure.dictionary.json > .value.json > .string.quoted.json, .source.json .meta.structure.array.json > .value.json > .string.quoted.json, .source.json .meta.structure.dictionary.json > .value.json > .string.quoted.json > .punctuation, .source.json .meta.structure.array.json > .value.json > .string.quoted.json > .punctuation => .syntax--source.syntax--json .syntax--meta.syntax--structure.syntax--dictionary.syntax--json > .syntax--value.syntax--json > .syntax--string.syntax--quoted.syntax--json, .syntax--source.syntax--json .syntax--meta.syntax--structure.syntax--array.syntax--json > .syntax--value.syntax--json > .syntax--string.syntax--quoted.syntax--json, .syntax--source.syntax--json .syntax--meta.syntax--structure.syntax--dictionary.syntax--json > .syntax--value.syntax--json > .syntax--string.syntax--quoted.syntax--json > .syntax--punctuation, .syntax--source.syntax--json .syntax--meta.syntax--structure.syntax--array.syntax--json > .syntax--value.syntax--json > .syntax--string.syntax--quoted.syntax--json > .syntax--punctuation .source.json .meta.structure.dictionary.json > .constant.language.json, .source.json .meta.structure.array.json > .constant.language.json => .syntax--source.syntax--json .syntax--meta.syntax--structure.syntax--dictionary.syntax--json > .syntax--constant.syntax--language.syntax--json, .syntax--source.syntax--json .syntax--meta.syntax--structure.syntax--array.syntax--json > .syntax--constant.syntax--language.syntax--json .mustache .meta.tag.template => .syntax--mustache .syntax--meta.syntax--tag.syntax--template .mustache .meta.tag.template .entity.name.tag => .syntax--mustache .syntax--meta.syntax--tag.syntax--template .syntax--entity.syntax--name.syntax--tag .go .variable => .syntax--go .syntax--variable .go .support.function.decl => .syntax--go .syntax--support.syntax--function.syntax--decl .source.python .class => .syntax--source.syntax--python .syntax--class .source.python .support.function.magic, .source.python .inherited-class => .syntax--source.syntax--python .syntax--support.syntax--function.syntax--magic, .syntax--source.syntax--python .syntax--inherited-class .source.python .support.function.magic .support.function.builtin.python, .source.python .inherited-class .support.function.builtin.python => .syntax--source.syntax--python .syntax--support.syntax--function.syntax--magic .syntax--support.syntax--function.syntax--builtin.syntax--python, .syntax--source.syntax--python .syntax--inherited-class .syntax--support.syntax--function.syntax--builtin.syntax--python .source.python .storage, .source.python .keyword => .syntax--source.syntax--python .syntax--storage, .syntax--source.syntax--python .syntax--keyword .source.python .string => .syntax--source.syntax--python .syntax--string .source.python .string.block => .syntax--source.syntax--python .syntax--string.syntax--block .source.python .string.block .keyword => .syntax--source.syntax--python .syntax--string.syntax--block .syntax--keyword

I have tried to fix all of the offending selectors, by replacing everything on the left side of the => with everything on the right side. My code is here:

After running this script and restarting Atom, I am still getting the following deprecation messages:

.syntax--keyword.control => .syntax--keyword.syntax--control .syntax--keyword.operator => .syntax--keyword.syntax--operator .syntax--keyword.other.special-method => .syntax--keyword.syntax--other.syntax--special-method .syntax--keyword.other.unit => .syntax--keyword.syntax--other.syntax--unit ... ... ... .source.python .syntax--string => .syntax--source.syntax--python .syntax--string .source.python .syntax--string.block => .syntax--source.syntax--python .syntax--string.syntax--block .source.python .syntax--string.block .syntax--keyword => .syntax--source.syntax--python .syntax--string.syntax--block .syntax--keyword

Since Atom already fixes these deprecated selectors internally, is there a simple way of fixing this?


Change the color and width of editor's sidebar
#2

The simple way to fix it is to go into a syntax theme that hasn’t been updated and replace all instances of . with .syntax--, since that’s what Atom does internally.


#3

It can’t be that simple. I can see a lot of other unrelated . characters:


#4

The ones not inside @import statements. So .(?!less). The others you show are in comments, which are harder to catch with a simple regex find and replace operation, but you can always do it by hand if you want (or if you intend to submit a PR to fix the deprecations).

It really is that simple. Atom takes all class selectors in the syntax theme and prepends syntax-- to them.


#5

Ok. That helps.

I think I will try the reverse approach, by making a list of the class selectors based on whatever follows .syntax-- in the deprecation replacements list.

Thank you.