fix(curriculum): update tests to specific methods cafe menu steps 1-13 (#59901)

Co-authored-by: Huyen Nguyen <25715018+huyenltnguyen@users.noreply.github.com>
This commit is contained in:
JoJo
2025-04-24 02:37:11 +01:00
committed by GitHub
parent 450fd76f2a
commit f8e92b2aac
11 changed files with 40 additions and 40 deletions

View File

@@ -14,31 +14,31 @@ Add a `head` element within the `html` element, so you can add a `title` element
You should have an opening `<head>` tag.
```js
assert(code.match(/<head>/i));
assert.match(code, /<head>/i);
```
You should have a closing `</head>` tag.
```js
assert(code.match(/<head>/i));
assert.match(code, /<head>/i);
```
You should have an opening `<title>` tag.
```js
assert(code.match(/<title>/i));
assert.match(code, /<title>/i);
```
You should have a closing `</title>` tag.
```js
assert(code.match(/<\/title>/i));
assert.match(code, /<\/title>/i);
```
Your `title` element should be nested in your `head` element.
```js
assert(code.match(/<head>\s*<title>.*<\/title>\s*<\/head>/si));
assert.match(code, /<head>\s*<title>.*<\/title>\s*<\/head>/si);
```
Your `title` element should have the text `Cafe Menu`. You may need to check your spelling.

View File

@@ -14,26 +14,26 @@ To prepare to create some actual content, add a `body` element below the `head`
You should have an opening `<body>` tag.
```js
assert(code.match(/<body>/i));
assert.match(code, /<body>/i);
```
You should have a closing `</body>` tag.
```js
assert(code.match(/<\/body>/i));
assert.match(code, /<\/body>/i);
```
You should not change your `head` element. Make sure you did not delete your closing tag.
```js
assert(code.match(/<head>/i));
assert(code.match(/<\/head>/i));
assert.match(code, /<head>/i);
assert.match(code, /<\/head>/i);
```
Your `body` element should come after your `head` element.
```js
assert(code.match(/<\/head>[.\n\s]*<body>/im));
assert.match(code, /<\/head>[.\n\s]*<body>/im);
```
# --seed--

View File

@@ -14,13 +14,13 @@ It's time to add some menu content. Add a `main` element within the existing `bo
Your code should have an opening `<main>` tag.
```js
assert(code.match(/<main>/i));
assert.match(code, /<main>/i);
```
Your code should have a closing `</main>` tag.
```js
assert(code.match(/<\/main>/i));
assert.match(code, /<\/main>/i);
```
You should not change your `body` element. Make sure you don't accidentally delete your closing tag.
@@ -33,7 +33,7 @@ Your `main` tag should be within your `body` tag.
```js
const main = document.querySelector('main');
assert(main.parentElement.tagName === 'BODY');
assert.equal(main.parentElement.tagName, 'BODY');
```
# --seed--

View File

@@ -14,13 +14,13 @@ The name of the cafe is `CAMPER CAFE`. So, add an `h1` element within your `main
You should have an opening `<h1>` tag.
```js
assert(code.match(/<h1>/i));
assert.match(code, /<h1>/i);
```
You should have a closing `</h1>` tag.
```js
assert(code.match(/<\/h1>/i));
assert.match(code, /<\/h1>/i);
```
You should not change your existing `main` element.
@@ -38,7 +38,7 @@ assert.equal(document.querySelector('h1')?.parentElement?.tagName, "MAIN");
Your `h1` element should have the text `CAMPER CAFE`.
```js
assert(code.match(/<h1>CAMPER CAFE<\/h1>/));
assert.match(code, /<h1>CAMPER CAFE<\/h1>/);
```
# --seed--

View File

@@ -14,13 +14,13 @@ To let visitors know the cafe was founded in `2020`, add a `p` element below the
You should have an opening `<p>` tag.
```js
assert(code.match(/<p>/i));
assert.match(code, /<p>/i);
```
You should have a closing `</p>` tag.
```js
assert(code.match(/<\/p>/i));
assert.match(code, /<\/p>/i);
```
You should not change your existing `h1` element. Make sure you did not delete the closing tag.
@@ -38,7 +38,7 @@ assert.equal(document.querySelector('p')?.previousElementSibling?.tagName, 'H1')
Your `p` element should have the text `Est. 2020`.
```js
assert(document.querySelector("p").innerText === "Est. 2020");
assert.equal(document.querySelector("p").innerText, "Est. 2020");
```
# --seed--

View File

@@ -23,21 +23,21 @@ You should have an `h1` selector in your `style` element.
```js
const hasSelector = new __helpers.CSSHelp(document).getStyle('h1');
assert(hasSelector);
assert.exists(hasSelector);
```
Your `text-align` property should have a value of `center`.
```js
const hasTextAlign = new __helpers.CSSHelp(document).getCSSRules().some(x => x.style['text-align'] === 'center');
assert(hasTextAlign);
assert.isTrue(hasTextAlign);
```
Your `h1` selector should set the `text-align` property to `center`.
```js
const h1TextAlign = new __helpers.CSSHelp(document).getStyle('h1')?.getPropertyValue('text-align');
assert(h1TextAlign === 'center');
assert.equal(h1TextAlign, 'center');
```
# --seed--

View File

@@ -14,19 +14,19 @@ Until now, you've had limited control over the presentation and appearance of yo
Your code should have an opening `<style>` tag.
```js
assert(code.match(/<style\s*>/i));
assert.match(code, /<style\s*>/i);
```
Your code should have a closing `</style>` tag.
```js
assert(code.match(/<\/style\s*>/));
assert.match(code, /<\/style\s*>/);
```
Your `style` element should be nested in your `head` element.
```js
assert(code.match(/<head\s*>[\w\W\s]*<style\s*>[\w\W\s]*<\/style\s*>[\w\W\s]*<\/head\s*>/i))
assert.match(code, /<head\s*>[\w\W\s]*<style\s*>[\w\W\s]*<\/style\s*>[\w\W\s]*<\/head\s*>/i)
```
# --seed--

View File

@@ -14,13 +14,13 @@ Create an `h2` element in the `section` element and give it the text `Coffee`.
You should have an opening `<h2>` tag.
```js
assert(code.match(/<h2\s*>/i));
assert.match(code, /<h2\s*>/i);
```
You should have a closing `</h2>` tag.
```js
assert(code.match(/<\/h2\s*>/i));
assert.match(code, /<\/h2\s*>/i);
```
You should not change your existing `section` element. Make sure you did not delete the closing tag.
@@ -33,14 +33,14 @@ Your `h2` element should be within your `section` element.
```js
const h2 = document.querySelector('h2');
assert(h2.parentElement.tagName === 'SECTION');
assert.equal(h2.parentElement.tagName, 'SECTION');
```
Your `h2` element should have the text `Coffee`.
```js
const h2 = document.querySelector('h2');
assert(h2.innerText === 'Coffee');
assert.equal(h2.innerText, 'Coffee');
```
# --seed--

View File

@@ -14,13 +14,13 @@ There will be two sections on the menu, one for coffees and one for desserts. Ad
You should have an opening `<section>` tag.
```js
assert(code.match(/<section\s*>/i));
assert.match(code, /<section\s*>/i);
```
You should have a closing `</section>` tag.
```js
assert(code.match(/<\/section\s*>/i));
assert.match(code, /<\/section\s*>/i);
```
You should not change your existing `main` element. Make sure you didn't delete the closing tag.
@@ -34,7 +34,7 @@ Your `section` element should be within your `main` element.
```js
const main = document.querySelector('main');
const section = document.querySelector('section');
assert(section.parentElement === main);
assert.strictEqual(section.parentElement, main);
```
# --seed--

View File

@@ -23,14 +23,14 @@ You should use a single type selector for all three elements, `h1, h2, p`. Be su
```js
const hasSelector = new __helpers.CSSHelp(document).getStyle('h1, h2, p');
assert(hasSelector);
assert.exists(hasSelector);
```
You should only have one selector in your `style` element.
```js
const selectors = new __helpers.CSSHelp(document).getCSSRules().filter(x => x.selectorText)
assert(selectors.length === 1);
assert.equal(selectors.length, 1);
```
# --seed--

View File

@@ -15,7 +15,7 @@ You should not change the existing `h1` selector.
```js
const hasH1 = new __helpers.CSSHelp(document).getStyle('h1');
assert(hasH1);
assert.exists(hasH1);
```
You should not add a new `style` tag. Add the new CSS rules to the existing `style` tag.
@@ -28,35 +28,35 @@ You should add a new `h2` selector.
```js
const hasH2 = new __helpers.CSSHelp(document).getStyle('h2');
assert(hasH2);
assert.exists(hasH2);
```
You should add a new `p` selector.
```js
const hasP = new __helpers.CSSHelp(document).getStyle('p');
assert(hasP);
assert.exists(hasP);
```
Your `h1` element should have a `text-align` of `center`.
```js
const h1TextAlign = new __helpers.CSSHelp(document).getStyle('h1')?.getPropertyValue('text-align');
assert(h1TextAlign === 'center');
assert.equal(h1TextAlign, 'center');
```
Your `h2` element should have a `text-align` of `center`.
```js
const h2TextAlign = new __helpers.CSSHelp(document).getStyle('h2')?.getPropertyValue('text-align');
assert(h2TextAlign === 'center');
assert.equal(h2TextAlign, 'center');
```
Your `p` element should have a `text-align` of `center`.
```js
const pTextAlign = new __helpers.CSSHelp(document).getStyle('p')?.getPropertyValue('text-align');
assert(pTextAlign === 'center');
assert.equal(pTextAlign, 'center');
```
# --seed--