CSS syntax module and error handling #31076

estelle · 2023-12-16T23:21:18Z

The original task was to update the charset module. Turns out there is no such thing.
Charset was defined in CSS 2 but removed in the CSS syntax module.

Move css_charset to css_syntax.
Created a new document: css_syntax. This is a module landing page. It includes the key concepts introduced in that module.
Created a new document: a guide on CSS error handling by the parser. a subpage for CSS syntax.
Updated the @charset page to indicate that it is NOT an at-rule, and has been deprecated in css-syntax.
Updated custom-ident, the page that had the best explanation of CSS escape characters, adding a separate section for escaping characters in CSS. This PR does not include creating links to that section. That will be done as a separate PR (this PR is already big enough)
related to CSS Charsets openwebdocs/project#186

This PR was previously reviewed and is now co-authored by @dipikabh. See #30793

Co-authored-by: Dipika Bhattacharya <[email protected]>

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

github-actions · 2023-12-16T23:23:46Z

Preview URLs

External URLs (1)

URL: /en-US/docs/Web/CSS/custom-ident
Title: <custom-ident>

https://en.wikipedia.org/wiki/Case_sensitivity (2 times) (Note! This may be a new URL 👀)

(comment last updated: 2023-12-19 14:25:39)

chrisdavidmills

Hi @estelle! Thanks for a great new set of content. I've included quite a lot of comments, but these are mainly just quibbles about individual grammar and prose points. There is a lot of dense detail in the error handling page, and a lot of my suggestions are centered around trying to make this great content as clear as possible.

files/en-us/web/css/@charset/index.md

chrisdavidmills · 2023-12-18T07:25:06Z

files/en-us/web/css/css_syntax/index.md

+
+The **CSS syntax** module describes, in general terms, the structure and syntax of cascading stylesheets, or CSS. It defines CSS as the language for describing the rendering of structured documents (such as HTML and XML), on the web and elsewhere.
+
+This module doesn't define any properties, {{cssxref("css_types", "data types")}}, {{cssxref("css_functions", "functions")}}, or {{cssxref("at-rule", "at-rules")}}. Rather, it elaborates on how all of these features should be defined and how user agents should parse CSS.


The links in this paragraph are not code terms but are formatted as such. Maybe use regular links for these? I'm not sure if csssxref allows you to do the same trick as domxref, e.g. {{cssxref("css_types", "data types", "", "nocode")}}, if you want them to not be shown in code font.

thanks. I did not know this trick.

Oops, looks like the links got broken. As I feared, that trick doesn't work in cssxref, only domxref. I've fixed the links for you as a penance for wasting your time.

files/en-us/web/css/css_syntax/index.md

files/en-us/web/css/custom-ident/index.md

files/en-us/web/css/@charset/index.md

files/en-us/web/css/css_syntax/error_handling/index.md

Co-authored-by: Chris Mills <[email protected]>

github-actions · 2023-12-18T19:24:08Z

files/en-us/web/css/css_syntax/error_handling/index.md

+
+Custom properties are generally considered valid when declared, but may create invalid CSS when accessed, i.e. they may be used as a value (via the {{cssxref("var")}} function) for a property that does not accept that value type. The browser parses each custom property when encountered without regard to where the property is consumed.
+
+Generally, when a property value is invalid, the declaration is ignored and the property falls back to the last valid value.  Invalid computed custom property values, however, work slightly differently.


[mdn-linter] _{reported by reviewdog 🐶}

Suggested change

Generally, when a property value is invalid, the declaration is ignored and the property falls back to the last valid value. Invalid computed custom property values, however, work slightly differently.

Generally, when a property value is invalid, the declaration is ignored and the property falls back to the last valid value. Invalid computed custom property values, however, work slightly differently.

files/en-us/web/css/css_syntax/index.md

estelle

@chrisdavidmills Thanks for the feedback. I think i captured everything.

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

files/en-us/web/css/css_syntax/index.md

files/en-us/web/css/css_syntax/error_handling/index.md

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

chrisdavidmills

Looking awesome, nice work @estelle (Simmons). Let's get this merged.

@charset

* New page: CSS syntax error handling * deprecate @charset and list as a rule not at-rule * Define character encoding * New page: error handling * New page: css syntax module * delete charset module. move to syntax module * still supported * table of contents * better grammar * better grammar * better grammar * better grammar * Apply suggestions from code review Co-authored-by: Dipika Bhattacharya <[email protected]> * added a few more notes - prefixes * edits per review * change h2 to h3 * Apply suggestions from code review Co-authored-by: Dipika Bhattacharya <[email protected]> * add guide to module page. * change UA to browser * address mdn#30793 (comment) * hyphens to underscores * rewrote the at-rule section * rewrite grammar section * fixing linter suggestions Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> * final tweaks * Update files/en-us/web/css/css_syntax/error_handling/index.md Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> * Update files/en-us/web/css/css_syntax/error_handling/index.md Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> * fix flaws * closed comments * borked so fixed * trailing spaces Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> * Update files/en-us/web/css/css_syntax/error_handling/index.md Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> * Update files/en-us/web/css/css_syntax/index.md Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> * Small punctuation fixes * Apply suggestions from code review Co-authored-by: Chris Mills <[email protected]> * header for at-rule * updates based on review feedback * link to display property * Apply suggestions from code review Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> * Update files/en-us/web/css/css_syntax/error_handling/index.md * Update files/en-us/web/css/css_syntax/index.md Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> * Fix broken links * typo fix --------- Co-authored-by: Dipika Bhattacharya <[email protected]> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> Co-authored-by: Chris Mills <[email protected]>

estelle and others added 30 commits December 4, 2023 20:29

New page: CSS syntax error handling

df11dae

deprecate @charset and list as a rule not at-rule

e9bffa8

Define character encoding

d5f1733

New page: error handling

bddc9a2

New page: css syntax module

9ff78fc

delete charset module. move to syntax module

1c099d5

still supported

df627d9

table of contents

9b2da17

better grammar

bd5f752

better grammar

10d57b2

better grammar

2d832cf

better grammar

3afcdbd

Apply suggestions from code review

e1424fb

Co-authored-by: Dipika Bhattacharya <[email protected]>

added a few more notes - prefixes

4691893

edits per review

245d126

change h2 to h3

24772a4

Apply suggestions from code review

4d5c582

Co-authored-by: Dipika Bhattacharya <[email protected]>

add guide to module page.

71944f1

change UA to browser

e287842

address mdn#30793 (comment)

50c42ce

hyphens to underscores

1ea3167

rewrote the at-rule section

e0f68c2

rewrite grammar section

ab85e39

fixing linter suggestions

53a33f3

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

final tweaks

debf7a9

Update files/en-us/web/css/css_syntax/error_handling/index.md

a1c3201

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

Update files/en-us/web/css/css_syntax/error_handling/index.md

496af3c

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

fix flaws

9d13c82

closed comments

30db514

borked so fixed

3d99029

estelle requested a review from chrisdavidmills December 16, 2023 23:21

github-actions bot added the Content:CSS Cascading Style Sheets docs label Dec 16, 2023

Small punctuation fixes

94969cd

chrisdavidmills requested changes Dec 18, 2023

View reviewed changes

estelle commented Dec 18, 2023

View reviewed changes

files/en-us/web/css/@charset/index.md Outdated Show resolved Hide resolved

estelle commented Dec 18, 2023

View reviewed changes

files/en-us/web/css/css_syntax/error_handling/index.md Outdated Show resolved Hide resolved

Apply suggestions from code review

362058e

Co-authored-by: Chris Mills <[email protected]>

github-actions bot reviewed Dec 18, 2023

View reviewed changes

estelle commented Dec 18, 2023

View reviewed changes

files/en-us/web/css/css_syntax/index.md Show resolved Hide resolved

header for at-rule

48612a6

github-actions bot reviewed Dec 18, 2023

View reviewed changes

files/en-us/web/css/css_syntax/index.md Show resolved Hide resolved

estelle added 2 commits December 18, 2023 12:05

updates based on review feedback

33c1b0d

link to display property

4c2638e

estelle commented Dec 18, 2023

View reviewed changes

estelle requested a review from chrisdavidmills December 18, 2023 20:13

Apply suggestions from code review

ada256a

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

github-actions bot reviewed Dec 18, 2023

View reviewed changes

files/en-us/web/css/css_syntax/index.md Show resolved Hide resolved

estelle commented Dec 18, 2023

View reviewed changes

files/en-us/web/css/css_syntax/error_handling/index.md Show resolved Hide resolved

estelle and others added 4 commits December 18, 2023 12:23

Update files/en-us/web/css/css_syntax/error_handling/index.md

1f95522

Update files/en-us/web/css/css_syntax/index.md

d2e6740

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

Fix broken links

0cd27ad

typo fix

39e7496

chrisdavidmills approved these changes Dec 19, 2023

View reviewed changes

chrisdavidmills merged commit 5affe90 into mdn:main Dec 19, 2023
8 checks passed

estelle deleted the charset branch January 9, 2024 03:49

ybiquitous mentioned this pull request Jan 23, 2024

Add at-charset-rule-no-invalid stylelint/stylelint#7492

Open

romainmenke mentioned this pull request Jan 23, 2024

[css-syntax] Is @charset deprecated? w3c/csswg-drafts#9838

Open

bsmth mentioned this pull request Jan 31, 2024

@charset is not deprecated #31882

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

CSS syntax module and error handling #31076

CSS syntax module and error handling #31076

estelle commented Dec 16, 2023 •

edited

Loading

github-actions bot commented Dec 16, 2023 •

edited

Loading

chrisdavidmills left a comment •

edited

Loading

chrisdavidmills Dec 18, 2023

estelle Dec 18, 2023

chrisdavidmills Dec 19, 2023

github-actions bot Dec 18, 2023

estelle left a comment

chrisdavidmills left a comment


		The CSS syntax module describes, in general terms, the structure and syntax of cascading stylesheets, or CSS. It defines CSS as the language for describing the rendering of structured documents (such as HTML and XML), on the web and elsewhere.

		This module doesn't define any properties, {{cssxref("css_types", "data types")}}, {{cssxref("css_functions", "functions")}}, or {{cssxref("at-rule", "at-rules")}}. Rather, it elaborates on how all of these features should be defined and how user agents should parse CSS.


		Custom properties are generally considered valid when declared, but may create invalid CSS when accessed, i.e. they may be used as a value (via the {{cssxref("var")}} function) for a property that does not accept that value type. The browser parses each custom property when encountered without regard to where the property is consumed.

		Generally, when a property value is invalid, the declaration is ignored and the property falls back to the last valid value. Invalid computed custom property values, however, work slightly differently.

CSS syntax module and error handling #31076

CSS syntax module and error handling #31076

Conversation

estelle commented Dec 16, 2023 • edited Loading

github-actions bot commented Dec 16, 2023 • edited Loading

chrisdavidmills left a comment • edited Loading

Choose a reason for hiding this comment

chrisdavidmills Dec 18, 2023

Choose a reason for hiding this comment

estelle Dec 18, 2023

Choose a reason for hiding this comment

chrisdavidmills Dec 19, 2023

Choose a reason for hiding this comment

github-actions bot Dec 18, 2023

Choose a reason for hiding this comment

estelle left a comment

Choose a reason for hiding this comment

chrisdavidmills left a comment

Choose a reason for hiding this comment

estelle commented Dec 16, 2023 •

edited

Loading

github-actions bot commented Dec 16, 2023 •

edited

Loading

chrisdavidmills left a comment •

edited

Loading