Skip to content

Commit

Permalink
fix: macro specifications with arrays
Browse files Browse the repository at this point in the history
  • Loading branch information
viperehonchuk authored and AdriandeCita committed Jan 27, 2024
1 parent dfe389e commit bc48baa
Show file tree
Hide file tree
Showing 4 changed files with 129 additions and 15 deletions.
17 changes: 15 additions & 2 deletions lib/kuma/macros/specifications.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,8 +4,8 @@ const bcd = readJsonDependency('@mdn/browser-compat-data', 'data.json');
const specs = readJsonDependency('browser-specs', 'index.json');

function specifications(explicitQuery) {
const { browserCompat: implicitQuery, specUrls: explicitSpecUrls = '' } =
this.env;
const { browserCompat: implicitQuery } = this.env;
let { specUrls: explicitSpecUrls = '' } = this.env;
const query = explicitQuery || implicitQuery;

if (!query && !explicitSpecUrls) {
Expand All @@ -15,6 +15,16 @@ function specifications(explicitQuery) {
let specURLs = [];

if (query) {
if (typeof query !== 'string') {
return query
.map((spec) =>
specifications.call({
...this,
env: { ...this.env, browserCompat: spec },
}),
)
.join('\n');
}
let data = bcd;

for (const current of query.split('.')) {
Expand All @@ -35,6 +45,9 @@ function specifications(explicitQuery) {
}

if (explicitSpecUrls !== '') {
if (typeof explicitSpecUrls !== 'string') {
explicitSpecUrls = explicitSpecUrls.join(',');
}
specURLs.push(...explicitSpecUrls.split(',').map((url) => url.trim()));
}

Expand Down
98 changes: 92 additions & 6 deletions test/src/kuma/macros/snapshots/specifications.mjs.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,23 +4,38 @@ The actual snapshot is saved in `specifications.mjs.snap`.

Generated by [AVA](https://avajs.dev).

## Macros 'specifications' should generate markup according to given query
## Macros 'specifications' should generate markup even without explicit query, if it is provided with the context

> Snapshot 1
`<div class="bcd__container">␊
Якщо ви це бачите — значить, щось трапилося з цією сторінкою.␊
</div>`

## Macros 'specifications' should generate markup even without explicit query, if it is provided with the context
## Macros 'specifications' should generate markup with browser-compatibility information

> Snapshot 1
`<div class="bcd__container">␊
Якщо ви це бачите — значить, щось трапилося з цією сторінкою.␊
</div>`
`<table class="table--standard">␊
<thead>␊
<tr>␊
<th scope="col">Специфікація</th>␊
</tr>␊
</thead>␊
<tbody>␊
<tr>␊
<td>␊
<a href="https://drafts.csswg.org/css-display/#the-display-properties">␊
CSS Display Module Level 3 (CSS Display 3)<br /><small>␊
# the-display-properties␊
</small>␊
</a>␊
</td>␊
</tr>␊
</tbody>␊
</table>`

## Macros 'specifications' should generate markup with browser-compatibility information
## Macros 'specifications' should support 'browserCompat' as an array

> Snapshot 1
Expand All @@ -39,6 +54,40 @@ Generated by [AVA](https://avajs.dev).
</small>␊
</a>␊
</td>␊
</tr><tr>␊
<td>␊
<a href="https://drafts.csswg.org/selectors/#specificity-rules">␊
Selectors Level 4 (Selectors 4)<br /><small>␊
# specificity-rules␊
</small>␊
</a>␊
</td>␊
</tr>␊
</tbody>␊
</table>␊
<table class="table--standard">␊
<thead>␊
<tr>␊
<th scope="col">Специфікація</th>␊
</tr>␊
</thead>␊
<tbody>␊
<tr>␊
<td>␊
<a href="https://drafts.csswg.org/css-color/#the-color-property">␊
CSS Color Module Level 4 (CSS Color 4)<br /><small>␊
# the-color-property␊
</small>␊
</a>␊
</td>␊
</tr><tr>␊
<td>␊
<a href="https://drafts.csswg.org/selectors/#specificity-rules">␊
Selectors Level 4 (Selectors 4)<br /><small>␊
# specificity-rules␊
</small>␊
</a>␊
</td>␊
</tr>␊
</tbody>␊
</table>`
Expand Down Expand Up @@ -86,3 +135,40 @@ Generated by [AVA](https://avajs.dev).
</tr>␊
</tbody>␊
</table>`

## Macros 'specifications' should support 'specUrls' as an array

> Snapshot 1
`<table class="table--standard">␊
<thead>␊
<tr>␊
<th scope="col">Специфікація</th>␊
</tr>␊
</thead>␊
<tbody>␊
<tr>␊
<td>␊
<a href="https://drafts.csswg.org/css-display/#the-display-properties">␊
CSS Display Module Level 3 (CSS Display 3)<br /><small>␊
# the-display-properties␊
</small>␊
</a>␊
</td>␊
</tr><tr>␊
<td>␊
<a href="https://drafts.csswg.org/css-flexbox/">␊
CSS Flexible Box Layout Module Level 1 (CSS Flexbox 1)<br />␊
</a>␊
</td>␊
</tr><tr>␊
<td>␊
<a href="https://drafts.csswg.org/selectors/#specificity-rules">␊
Selectors Level 4 (Selectors 4)<br /><small>␊
# specificity-rules␊
</small>␊
</a>␊
</td>␊
</tr>␊
</tbody>␊
</table>`
Binary file modified test/src/kuma/macros/snapshots/specifications.mjs.snap
Binary file not shown.
29 changes: 22 additions & 7 deletions test/src/kuma/macros/specifications.mjs
Original file line number Diff line number Diff line change
Expand Up @@ -6,13 +6,6 @@ test("Macros 'specifications' should be present", (t) => {
t.truthy(macros({}).lookup('specifications'));
});

test("Macros 'specifications' should generate markup according to given query", (t) => {
const specifications = macros({
env: { browserCompat: 'some.different.query' },
}).lookup('specifications');
t.snapshot(specifications('some.query'));
});

test("Macros 'specifications' should generate markup even without explicit query, if it is provided with the context", (t) => {
const specifications = macros({
env: { browserCompat: 'some.query' },
Expand All @@ -26,6 +19,15 @@ test("Macros 'specifications' should generate markup with browser-compatibility
}).lookup('specifications');
t.snapshot(specifications());
});
test("Macros 'specifications' should support 'browserCompat' as an array", (t) => {
const specifications = macros({
env: {
browserCompat: ['css.properties.display', 'css.properties.color'],
specUrls: 'https://drafts.csswg.org/selectors/#specificity-rules',
},
}).lookup('specifications');
t.snapshot(specifications());
});

test("Macros 'specifications' should support 'specUrls' parameter", (t) => {
const specifications = macros({
Expand All @@ -44,3 +46,16 @@ test("Macros 'specifications' should support 'specUrls' parameter without anchor
}).lookup('specifications');
t.snapshot(specifications());
});

test("Macros 'specifications' should support 'specUrls' as an array", (t) => {
const specifications = macros({
env: {
specUrls: [
'https://drafts.csswg.org/css-flexbox/',
'https://drafts.csswg.org/selectors/#specificity-rules',
],
browserCompat: 'css.properties.display',
},
}).lookup('specifications');
t.snapshot(specifications());
});

0 comments on commit bc48baa

Please sign in to comment.