Change:
We recently updated the guidelines for writing assertions here For consistency and matching what is in the docs, we should slowly start to update the tests for the workshops and labs in the new frontend cert. For this issue, just focus on updating the tests for steps 36 - 40 of the cat photo app workshop. We don't want to have a large PR that updates a whole bunch of tests in a bunch of steps and makes it harder to review. Here is the link to the workshop: The tests should be updated, where appropriate, to use specific methods like , , , etc instead of just . Here is the complete API reference Just focus on the new frontend cert and don't worry about updating the RWD cat photo app since that will become legacy anyway.

Discussion:
You have either deleted the `body` element or it is missing an opening tag or closing tag. ```js <del> assert(document.querySelector('body') && code.match(/</body>/)); </del> <ins> assert.exists(document.querySelector('body')); assert.match(code, /</body>/); </ins> ``` Your `head` element should have an opening tag. Opening tags have the following syntax: `<elementName>`. ```js <del> assert(code.match(/<head>/)); </del> <ins> assert.match(code, /<head>/); </ins> ``` Your `head` element should have a closing tag. Closing tags have a `/` just after the `<` character. ```js <del> assert(code.match(/</head>/)); </del> <ins> assert.match(code, /</head>/); </ins> ``` Your `head` element should be above the opening `body` element tag. You have put it somewhere else. ```js const noSpaces = code.replace(/s/g, ''); <del> assert(noSpaces.match(/</head><body>/)); </del> <ins> assert.match(noSpaces, /</head><body>/); </ins> ``` # --seed--

You have either deleted the `head` element or it is missing an opening tag or closing tag. ```js <del> assert(code.match(/<head>/) && code.match(/</head>/)); </del> <ins> assert.match(code, /<head>/); assert.match(code, /</head>/); </ins> ``` Your `title` element should be nested in the `head` element. Make sure to add an opening tag and closing tag for the `title` element. ```js const noSpaces = code.replace(/s/g, ''); <del> assert(noSpaces.match(/<head><title>.*</title></head>/)); </del> <ins> assert.match(noSpaces, /<head><title>.*</title></head>/); </ins> ``` Your `title` element should have a closing tag. Closing tags have a `/` just after the `<` character. ```js <del> assert(code.match(/</title>/)); </del> <ins> assert.match(code, /</title>/); </ins> ``` Your `title` element's text should be `CatPhotoApp`. You have either omitted the text or have a typo. ```js <del> assert(document.title && document.title.toLowerCase() === 'catphotoapp'); </del> <ins> assert.equal(document.title?.toLowerCase(), 'catphotoapp'); </ins> ``` # --seed--

You have either deleted the `html` element or it is missing an opening tag or closing tag. ```js <del> assert(code.match(/<html.*?>/) && code.match(/</html>/)); </del> <ins> assert.match(code, /<html.*?>/); assert.match(code, /</html>/); </ins> ``` Your `html` element should have a `lang` attribute with the value `en`. You may have omitted the attribute/value, or have a typo. ```js const extraSpacesRemoved = code.replace(/s+/g, " "); <del> assert(extraSpacesRemoved.match(/<htmls+langs*=s*("?|'?)en1s*>/)); </del> <ins> assert.match(extraSpacesRemoved, /<htmls+langs*=s*("?|'?)en1s*>/); </ins> ``` # --seed--

Your code should begin with the declaration `<!DOCTYPE html>`. You may have omitted the declaration, have a typo, or it is not the first line of code. ```js <del> assert(code.match(/<s*!DOCTYPEs+htmls*>/)); </del> <ins> assert.match(code, /<s*!DOCTYPEs+htmls*>/); </ins> ``` Your `<!DOCTYPE html>` must be located at the top of the document. ```js const noSpaces = code.replace(/s/g, ''); <del> assert(noSpaces.match(/^<!DOCTYPEhtml><html/)); </del> <ins> assert.match(noSpaces, /^<!DOCTYPEhtml><html/); </ins> ``` # --seed--