Subject: 29.0.60; css{-ts}-mode highlight problem

From: 牟 桐 <[email-masked]>
Date: Mon, 13 Feb 2023 09:10:46 +0000

Hi there,

I met a css-mode's highlight problem.

Create a test.css file:

``` css-ts-mode
.test\.123 {
  color: red;
}
.test\#123 {
  color: blue;
}
.test\@123 {
  color: green;
}
.test\<123 {
  color: brown;
}
.test\`123 {
  color: purple;
}
.test\~123 {
  color: tomato;
}
```

Then import the css file in the test.html file:

``` html-ts-mode
<head>
  <link rel="stylesheet" type="text/css" href="./test.css"  />
</head>
<body>
  <div class="test.123">test.123</div>
  <div class="test#123">test#123</div>
  <div class="test@123">test@123</div>
  <div class="test<123">test<123</div>
  <div class="test`123">test`123</div>
  <div class="test~123">test~123</div>
</body>
```

We can see all of the div inner text are colored correctly, but when
using css-ts-mode, there will be an error face after the escaped
character `\.123` and so on; on `css-mode`, these css class names are not
highlighted.

When I'm checking the [offical
doc](https://www.w3.org/TR/CSS21/syndata.html#characters), I saw that

> In CSS, identifiers can contain only the characters [a-zA-Z0-9] and
> ISO 10646 characters U+00A0 and higher, plus the hyphen (-) and the
> underscore (_)

I don't know whether the major mode is designed to work like this (since
the official said the `.` `#` ... are invalid, perhaps the browser made
them work) or is the major mode's bug.

Thanks ;)

In GNU Emacs 29.0.60 (build 1, x86_64-apple-darwin21.6.0, NS
appkit-2113.60 Version 12.6.3 (Build 21G419)) of 2023-02-13 built on
dalum.local
Repository revision: f49caaa892576e5fa95373c38e6a99904249551c
Repository branch: emacs-29
Windowing system distributor 'Apple', version 10.3.2113
System Description:  macOS 12.6.3

Configured using:
'configure --with-native-compilation=aot'

Configured features:
ACL DBUS GIF GLIB GMP GNUTLS JPEG JSON LCMS2 LIBXML2 MODULES NATIVE_COMP
NOTIFY KQUEUE NS PDUMPER PNG RSVG SQLITE3 THREADS TIFF
TOOLKIT_SCROLL_BARS TREE_SITTER WEBP XIM ZLIB

Important settings:
  value of $LANG: en_US.UTF-8
  locale-coding-system: utf-8-unix

Major mode: CSS

Minor modes in effect:
  global-avy-zh-mode: t
  avy-zh-mode: t
  global-git-commit-mode: t
  shell-dirtrack-mode: t
  subword-mode: t
  rainbow-delimiters-mode: t
  editorconfig-mode: t
  eyebrowse-mode: t
  diff-hl-flydiff-mode: t
  global-diff-hl-mode: t
  diff-hl-mode: t
  vertico-mode: t
  corfu-popupinfo-mode: t
  global-corfu-mode: t
  corfu-mode: t
  global-hl-todo-mode: t
  hl-todo-mode: t
  yas-global-mode: t
  yas-minor-mode: t
  global-evil-zh-mode: t
  evil-zh-mode: t
  global-evil-surround-mode: t
  evil-surround-mode: t
  evil-mode: t
  evil-local-mode: t
  windmove-mode: t
  treesit-explore-mode: t
  treesit-inspect-mode: t
  winum-mode: t
  marginalia-mode: t
  auto-compile-on-load-mode: t
  auto-compile-on-save-mode: t
  override-global-mode: t
  pixel-scroll-precision-mode: t
  display-time-mode: t
  winner-mode: t
  electric-pair-mode: t
  global-auto-revert-mode: t
  save-place-mode: t
  global-so-long-mode: t
  delete-selection-mode: t
  recentf-mode: t
  tooltip-mode: t
  global-eldoc-mode: t
  show-paren-mode: t
  electric-indent-mode: t
  mouse-wheel-mode: t
  tool-bar-mode: t
  menu-bar-mode: t
  file-name-shadow-mode: t
  global-font-lock-mode: t
  font-lock-mode: t
  size-indication-mode: t
  column-number-mode: t
  line-number-mode: t
  transient-mark-mode: t
  auto-composition-mode: t
  auto-encryption-mode: t
  auto-compression-mode: t

Load-path shadows:
/Users/mou/.emacs.d/etc/abbrev hides /Applications/Emacs.app/Contents/Resources/lisp/abbrev

Features:
(shadow sort mail-extr emacsbug tabify evil-nerd-commenter
evil-nerd-commenter-operator evil-nerd-commenter-sdk eglot
external-completion array jsonrpc ert debug backtrace find-func xref
flymake-proc flymake ace-window avy-zh avy files-x color-rg grep compile
css-mode smie sgml-mode facemenu eww xdg url-queue shr pixel-fill
kinsoku url-file svg xml dom mm-url gnus nnheader range face-remap
forge-list forge-commands forge-semi forge-bitbucket buck forge-gogs
gogs forge-gitea gtea forge-gitlab glab forge-github ghub-graphql treepy
gsexp ghub url-http url-gw nsm url-auth let-alist gnutls forge-notify
forge-revnote forge-pullreq forge-issue forge-topic yaml parse-time
iso8601 bug-reference forge-post markdown-mode edit-indirect noutline
outline forge-repo forge forge-core forge-db closql emacsql-sqlite
emacsql emacsql-compiler magit-bookmark magit-submodule magit-obsolete
magit-blame magit-stash magit-reflog magit-bisect magit-push magit-pull
magit-fetch magit-clone magit-remote magit-commit magit-sequence
magit-notes magit-worktree magit-tag magit-merge magit-branch
magit-reset magit-files magit-refs magit-status magit magit-repos
magit-apply magit-wip magit-log which-func magit-diff smerge-mode
git-commit log-edit message sendmail yank-media puny rfc822 mml mml-sec
epa epg rfc6068 epg-config gnus-util mm-decode mm-bodies mm-encode
mail-parse rfc2231 rfc2047 rfc2045 mm-util ietf-drums mail-prsvr
mailabbrev mail-utils gmm-utils mailheader add-log magit-core
magit-autorevert magit-margin magit-transient magit-process with-editor
shell pcomplete comint ansi-osc server ansi-color magit-mode transient
magit-git magit-base magit-section crm shortdoc help-fns dabbrev
cape-keyword cape apheleia typescript-ts-mode vc-hg vc-bzr vc-src
vc-sccs vc-cvs vc-rcs diff-hl-dired misearch multi-isearch js
c-ts-common imenu citre-lang-c cc-mode cc-fonts cc-guess cc-menus
cc-cmds cc-styles cc-align cc-engine cc-vars cc-defs json-ts-mode vc-git
vc-svn citre citre-global emmet-mode web-mode disp-table time-date
gruvbox-theme gruvbox autothemer tango-theme consult-vertico consult
bookmark text-property-search pp jka-compr cap-words superword subword
rainbow-delimiters editorconfig package browse-url url url-proxy
url-privacy url-expand url-methods url-history url-cookie url-domsuf
url-util mailcap url-handlers url-parse auth-source eieio eieio-core
password-cache json map url-vars editorconfig-core
editorconfig-core-handle editorconfig-fnmatch eyebrowse format-spec
diff-hl-flydiff diff diff-hl log-view pcvs-util vc-dir ewoc vc
vc-dispatcher diff-mode orderless vertico corfu-popupinfo corfu hl-todo
yasnippet init-lsp init-python init-dart init-web derived init-lua
init-js init-tex init-sexp init-chinese init-snippet init-markup
init-evil general evil-zh evil-surround evil evil-keybindings
evil-integration evil-maps evil-commands reveal evil-jumps
evil-command-window evil-search evil-ex evil-types evil-macros
evil-repeat evil-states evil-core advice evil-common windmove calc
calc-loaddefs calc-macs thingatpt rect evil-digraphs evil-vars init-irc
init-reader init-misc init-check flyspell ispell init-prog citre-config
citre-lang-fileref citre-tags citre-ctags citre-readtags
citre-readtags-tables citre-backend-interface citre-ui-peek color
citre-ui-jump citre-common-tag citre-common-util project byte-opt
treesit init-corfu init-vertico init-vc init-edit winum dash edmacro
kmacro marginalia zh-lib init-package no-littering compat auto-compile
comp comp-cstr warnings icons use-package use-package-ensure
use-package-delight use-package-diminish use-package-bind-key bind-key
use-package-core zh-lib-autoloads zenburn-theme-autoloads
yasnippet-autoloads yaml-autoloads xr-autoloads with-editor-autoloads
winum-autoloads wgrep-autoloads websocket-autoloads web-mode-autoloads
vundo-autoloads vertico-autoloads valign-autoloads treepy-autoloads
tomelr-autoloads toc-org-autoloads tao-theme-autoloads tablist-autoloads
subed-autoloads srcery-theme-autoloads spacemacs-theme-autoloads
solarized-theme-autoloads sinolor-themes-autoloads separedit-autoloads
search-dired-autoloads s-autoloads request-autoloads
rainbow-mode-autoloads rainbow-delimiters-autoloads
pyim-basedict-autoloads pyim-autoloads pug-mode-autoloads
posframe-autoloads popon-autoloads polymode-autoloads php-mode-autoloads
pdf-tools-autoloads ox-hugo-autoloads organic-green-theme-autoloads
orderless-autoloads nord-theme-autoloads no-littering-autoloads
monokai-theme-autoloads moe-theme-autoloads material-theme-autoloads
markdown-mode-autoloads marginalia-autoloads magit-autoloads
lua-mode-autoloads llama-autoloads leuven-theme-autoloads
kaolin-themes-autoloads htmlize-autoloads hl-todo-autoloads
gruvbox-theme-autoloads green-is-the-new-black-theme-autoloads
goto-chg-autoloads git-modes-autoloads git-link-autoloads ghub-autoloads
ggtags-autoloads general-autoloads geiser-mit-autoloads
geiser-guile-autoloads geiser-autoloads forge-autoloads f-autoloads
eyebrowse-autoloads expand-region-autoloads evil-zh-autoloads
evil-surround-autoloads evil-nerd-commenter-autoloads evil-autoloads
epkg-marginalia-autoloads epkg-autoloads embark-autoloads
emacsql-autoloads elfeed-org-autoloads elfeed-autoloads ein-autoloads
ef-themes-autoloads editorconfig-autoloads edit-indirect-autoloads
dracula-theme-autoloads doom-themes-autoloads diff-hl-autoloads
deferred-autoloads dash-autoloads dart-mode-autoloads
darktooth-theme-autoloads darkroom-autoloads cyberpunk-theme-autoloads
corfu-autoloads consult-autoloads compat-autoloads
color-theme-sanityinc-tomorrow-autoloads
color-theme-sanityinc-solarized-autoloads color-rg-autoloads
closql-autoloads citre-autoloads chocolate-theme-autoloads
challenger-deep-theme-autoloads cape-autoloads borg-autoloads
avy-zh-autoloads avy-autoloads autothemer-autoloads
auto-yasnippet-autoloads auto-compile-autoloads
atom-one-dark-theme-autoloads async-autoloads apheleia-autoloads
anti-zenburn-theme-autoloads anaphora-autoloads ample-theme-autoloads
all-the-icons-autoloads alect-themes-autoloads cl-extra help-mode
ace-window-autoloads cl-seq borg loaddefs-gen generate-lisp-file
lisp-mnt radix-tree info bytecomp byte-compile init-gui pixel-scroll
cua-base subr-x init-ibuffer ibuf-macs init-org init-dired dired-aux
dired-x dired dired-loaddefs init-funcs rx easy-mmode cl-macs gv pcase
init-modeline time init-utils whitespace winner ring midnight elec-pair
autorevert filenotify saveplace so-long delsel recentf tree-widget
wid-edit cl-loaddefs cl-lib rmc iso-transl tooltip cconv eldoc paren
electric uniquify ediff-hook vc-hooks lisp-float-type elisp-mode mwheel
term/ns-win ns-win ucs-normalize mule-util term/common-win tool-bar dnd
fontset image regexp-opt fringe tabulated-list replace newcomment
text-mode lisp-mode prog-mode register page tab-bar menu-bar rfn-eshadow
isearch easymenu timer select scroll-bar mouse jit-lock font-lock syntax
font-core term/tty-colors frame minibuffer nadvice seq simple cl-generic
indonesian philippine cham georgian utf-8-lang misc-lang vietnamese
tibetan thai tai-viet lao korean japanese eucjp-ms cp51932 hebrew greek
romanian slovak czech european ethiopic indian cyrillic chinese
composite emoji-zwj charscript charprop case-table epa-hook
jka-cmpr-hook help abbrev obarray oclosure cl-preloaded button loaddefs
theme-loaddefs faces cus-face macroexp files window text-properties
overlay sha1 md5 base64 format env code-pages mule custom widget keymap
hashtable-print-readable backquote threads dbusbind kqueue cocoa ns
lcms2 multi-tty make-network-process native-compile emacs)

Memory information:
((conses 16 792520 441243)
(symbols 48 40733 22)
(strings 32 151490 77073)
(string-bytes 1 5490587)
(vectors 16 94385)
(vector-slots 8 2370699 636685)
(floats 8 569 1493)
(intervals 56 18288 7932)
(buffers 984 60))