Skip to content

Commit 79f0e53

Browse files
authored
add atRules from MDN, prepare 0.5.2 (#115)
1 parent 68fd356 commit 79f0e53

File tree

6 files changed

+198
-6
lines changed

6 files changed

+198
-6
lines changed

web-data/css/generateData.mjs

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
import fs from 'fs';
99
import path from 'path';
1010
import { addMDNProperties } from './mdn/mdn-data-importer.mjs';
11-
import { addMDNPseudoElements, addMDNPseudoSelectors } from './mdn/mdn-data-selector-importer.mjs';
11+
import { addMDNAtDirectives, addMDNPseudoElements, addMDNPseudoSelectors } from './mdn/mdn-data-selector-importer.mjs';
1212
import { addBrowserCompatDataToProperties, addMDNReferences, browserNames } from './mdn/mdn-browser-compat-data-importer.mjs';
1313
import { applyRelevance } from './chromestatus/applyRelevance.mjs';
1414
import { computeBaseline } from 'compute-baseline';
@@ -335,7 +335,8 @@ async function process() {
335335

336336
const data = await readFile(path.resolve(__dirname, schemaFileName));
337337
const result = JSON.parse(data.toString());
338-
const atDirectives = toSource(result, 'atDirectives');
338+
let atDirectives = toSource(result, 'atDirectives');
339+
atDirectives = await addMDNAtDirectives(atDirectives);
339340

340341
let pseudoClasses = toSource(result, 'pseudoClasses');
341342
pseudoClasses = await addMDNPseudoSelectors(pseudoClasses);

web-data/css/mdn/mdn-data-selector-importer.mjs

Lines changed: 36 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
import mdnData from 'mdn-data';
99
import mdnCompatData from '@mdn/browser-compat-data' with { type: 'json' };
1010
import { abbreviateStatus } from './mdn-data-importer.mjs';
11-
import { pseudoSelectorDescriptions, pseudoElementDescriptions, fetchDocFromMDN } from './mdn-documentation.mjs';
11+
import { pseudoSelectorDescriptions, pseudoElementDescriptions, fetchDocFromMDN, atDirectiveDescriptions } from './mdn-documentation.mjs';
1212

1313
export async function addMDNPseudoElements(vscPseudoElements) {
1414
const mdnSelectors = mdnData.css.selectors;
@@ -103,3 +103,38 @@ export async function addMDNPseudoSelectors(vscPseudoClasses) {
103103

104104
return allPseudoSelectors;
105105
}
106+
107+
export async function addMDNAtDirectives(atDirectives) {
108+
const mdnAtRules = mdnData.css.atRules;
109+
const allAtDirectives = atDirectives;
110+
const allAtDirectiveNames = atDirectives.map(s => s.name);
111+
const missingDocumentation = [];
112+
113+
for (const name of Object.keys(mdnAtRules)) {
114+
if (!allAtDirectiveNames.includes(name)) {
115+
const desc = atDirectiveDescriptions[name] || '';
116+
if (!desc) {
117+
missingDocumentation.push(name);
118+
}
119+
120+
allAtDirectives.push({
121+
name: name,
122+
desc: desc,
123+
browsers: undefined
124+
});
125+
}
126+
}
127+
128+
if (missingDocumentation.length) {
129+
console.log('add to mdn-documentation.ts (atDirectiveDescriptions):');
130+
const fetchedDocs = ['{'];
131+
for (let prop of missingDocumentation) {
132+
const doc = await fetchDocFromMDN(prop.replace(/:/, '_colon_'), undefined);
133+
fetchedDocs.push(` '${prop}': \`${doc ?? ''}\`,`);
134+
}
135+
fetchedDocs.push('}');
136+
console.log(fetchedDocs.join('\n'));
137+
}
138+
139+
return allAtDirectives;
140+
}

web-data/css/mdn/mdn-documentation.mjs

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -388,4 +388,14 @@ export const pseudoElementDescriptions = {
388388
'::scroll-marker-group': `The ::scroll-marker-group CSS pseudo-element is generated inside a scroll container and contains any ::scroll-marker pseudo-elements generated on descendants of the scroll container.`,
389389
};
390390

391+
export const atDirectiveDescriptions = {
392+
'@container': `The @container CSS at-rule is a conditional group rule that applies styles to a containment context.`,
393+
'@document': `The @document CSS at-rule restricts the style rules contained within it based on the URL of the document. It is designed primarily for user-defined style sheets (see userchrome.org for more information), though it can be used on author-defined style sheets, too.`,
394+
'@font-palette-values': `The @font-palette-values CSS at-rule allows you to customize the default values of font-palette created by the font-maker.`,
395+
'@position-try': `The @position-try CSS at-rule is used to define a custom position try fallback option, which can be used to define positioning and alignment for anchor-positioned elements. One or more sets of position try fallback options can be applied to the anchored element via the position-try-fallbacks property or position-try shorthand. When the positioned element is moved to a position where it starts to overflow its containing block or the viewport, the browser will select the first position try fallback option it finds that places the positioned element fully back on-screen.`,
396+
'@scope': `The @scope CSS at-rule enables you to select elements in specific DOM subtrees, targeting elements precisely without writing overly-specific selectors that are hard to override, and without coupling your selectors too tightly to the DOM structure.`,
397+
'@starting-style': `The @starting-style CSS at-rule is used to define starting values for properties set on an element that you want to transition from when the element receives its first style update, i.e., when an element is first displayed on a previously loaded page.`,
398+
'@view-transition': `The @view-transition CSS at-rule is used to opt in the current and destination documents to undergo a view transition, in the case of a cross-document navigation.`,
399+
};
400+
391401

web-data/data/browsers.css-data.json

Lines changed: 146 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -28638,6 +28638,152 @@
2863828638
"S4"
2863928639
],
2864028640
"description": "Defines set of animation key frames."
28641+
},
28642+
{
28643+
"name": "@container",
28644+
"browsers": [
28645+
"E105",
28646+
"FF110",
28647+
"FFA110",
28648+
"S16",
28649+
"SM16",
28650+
"C105",
28651+
"CA105",
28652+
"O91"
28653+
],
28654+
"references": [
28655+
{
28656+
"name": "MDN Reference",
28657+
"url": "https://developer.mozilla.org/docs/Web/CSS/@container"
28658+
}
28659+
],
28660+
"baseline": {
28661+
"status": "low",
28662+
"baseline_low_date": "2023-02-14"
28663+
},
28664+
"description": "The @container CSS at-rule is a conditional group rule that applies styles to a containment context."
28665+
},
28666+
{
28667+
"name": "@document",
28668+
"references": [
28669+
{
28670+
"name": "MDN Reference",
28671+
"url": "https://developer.mozilla.org/docs/Web/CSS/@document"
28672+
}
28673+
],
28674+
"baseline": {
28675+
"status": "false"
28676+
},
28677+
"description": "The @document CSS at-rule restricts the style rules contained within it based on the URL of the document. It is designed primarily for user-defined style sheets (see userchrome.org for more information), though it can be used on author-defined style sheets, too."
28678+
},
28679+
{
28680+
"name": "@font-palette-values",
28681+
"browsers": [
28682+
"E101",
28683+
"FF107",
28684+
"FFA107",
28685+
"S15.4",
28686+
"SM15.4",
28687+
"C101",
28688+
"CA101",
28689+
"O87"
28690+
],
28691+
"references": [
28692+
{
28693+
"name": "MDN Reference",
28694+
"url": "https://developer.mozilla.org/docs/Web/CSS/@font-palette-values"
28695+
}
28696+
],
28697+
"baseline": {
28698+
"status": "low",
28699+
"baseline_low_date": "2022-11-15"
28700+
},
28701+
"description": "The @font-palette-values CSS at-rule allows you to customize the default values of font-palette created by the font-maker."
28702+
},
28703+
{
28704+
"name": "@position-try",
28705+
"browsers": [
28706+
"E125",
28707+
"C125",
28708+
"CA125",
28709+
"O111"
28710+
],
28711+
"references": [
28712+
{
28713+
"name": "MDN Reference",
28714+
"url": "https://developer.mozilla.org/docs/Web/CSS/@position-try"
28715+
}
28716+
],
28717+
"baseline": {
28718+
"status": "false"
28719+
},
28720+
"description": "The @position-try CSS at-rule is used to define a custom position try fallback option, which can be used to define positioning and alignment for anchor-positioned elements. One or more sets of position try fallback options can be applied to the anchored element via the position-try-fallbacks property or position-try shorthand. When the positioned element is moved to a position where it starts to overflow its containing block or the viewport, the browser will select the first position try fallback option it finds that places the positioned element fully back on-screen."
28721+
},
28722+
{
28723+
"name": "@scope",
28724+
"browsers": [
28725+
"E118",
28726+
"S17.4",
28727+
"SM17.4",
28728+
"C118",
28729+
"CA118",
28730+
"O104"
28731+
],
28732+
"references": [
28733+
{
28734+
"name": "MDN Reference",
28735+
"url": "https://developer.mozilla.org/docs/Web/CSS/@scope"
28736+
}
28737+
],
28738+
"baseline": {
28739+
"status": "false"
28740+
},
28741+
"description": "The @scope CSS at-rule enables you to select elements in specific DOM subtrees, targeting elements precisely without writing overly-specific selectors that are hard to override, and without coupling your selectors too tightly to the DOM structure."
28742+
},
28743+
{
28744+
"name": "@starting-style",
28745+
"browsers": [
28746+
"E117",
28747+
"FF129",
28748+
"FFA129",
28749+
"S17.5",
28750+
"SM17.5",
28751+
"C117",
28752+
"CA117",
28753+
"O103"
28754+
],
28755+
"references": [
28756+
{
28757+
"name": "MDN Reference",
28758+
"url": "https://developer.mozilla.org/docs/Web/CSS/@starting-style"
28759+
}
28760+
],
28761+
"baseline": {
28762+
"status": "low",
28763+
"baseline_low_date": "2024-08-06"
28764+
},
28765+
"description": "The @starting-style CSS at-rule is used to define starting values for properties set on an element that you want to transition from when the element receives its first style update, i.e., when an element is first displayed on a previously loaded page."
28766+
},
28767+
{
28768+
"name": "@view-transition",
28769+
"browsers": [
28770+
"E126",
28771+
"S18.2",
28772+
"SM18.2",
28773+
"C126",
28774+
"CA126",
28775+
"O112"
28776+
],
28777+
"references": [
28778+
{
28779+
"name": "MDN Reference",
28780+
"url": "https://developer.mozilla.org/docs/Web/CSS/@view-transition"
28781+
}
28782+
],
28783+
"baseline": {
28784+
"status": "false"
28785+
},
28786+
"description": "The @view-transition CSS at-rule is used to opt in the current and destination documents to undergo a view transition, in the case of a cross-document navigation."
2864128787
}
2864228788
],
2864328789
"pseudoClasses": [

web-data/package-lock.json

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

web-data/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@vscode/web-custom-data",
3-
"version": "0.5.1",
3+
"version": "0.5.2",
44
"license": "MIT",
55
"author": "Visual Studio Code Team",
66
"repository": {

0 commit comments

Comments
 (0)