feat(curriculum): refactor step 12 and check images using .src (fre…

…eCodeCamp#56735) Co-authored-by: Oliver Eyton-Williams <[email protected]> Co-authored-by: Dario-DC <[email protected]> Co-authored-by: Mrugesh Mohapatra <[email protected]>
1420663 · Oct 21, 2024 · f8287ce · f8287ce
1 parent 5df8774
commit f8287ce
Show file tree

Hide file tree

Showing 75 changed files with 522 additions and 430 deletions.
diff --git a/curriculum/challenges/_meta/learn-html-by-building-a-cat-photo-app/meta.json b/curriculum/challenges/_meta/learn-html-by-building-a-cat-photo-app/meta.json
@@ -53,236 +53,244 @@
       "title": "Step 11"
     },
     {
-      "id": "5dfa22d1b521be39a3de7be0",
+      "id": "671141d8e32fe934c26fa1be",
       "title": "Step 12"
     },
     {
-      "id": "62dabe2ef403a12d5d295273",
+      "id": "671141f948cbab359e74cc93",
       "title": "Step 13"
     },
     {
-      "id": "5dfa2407b521be39a3de7be1",
+      "id": "671141feba228a35cefba82d",
       "title": "Step 14"
     },
     {
-      "id": "5dfa30b9eacea3f48c6300ad",
+      "id": "5dfa2407b521be39a3de7be1",
       "title": "Step 15"
     },
     {
-      "id": "5f07be6ef7412fbad0c5626b",
+      "id": "671144cdcc01d73f7dd79dc9",
       "title": "Step 16"
     },
     {
-      "id": "5f07c98cdb9413cbd4b16750",
+      "id": "5dfa30b9eacea3f48c6300ad",
       "title": "Step 17"
     },
     {
-      "id": "5dfa3589eacea3f48c6300ae",
+      "id": "5f07be6ef7412fbad0c5626b",
       "title": "Step 18"
     },
     {
-      "id": "5dfa371beacea3f48c6300af",
+      "id": "5f07c98cdb9413cbd4b16750",
       "title": "Step 19"
     },
     {
-      "id": "5dfa37b9eacea3f48c6300b0",
+      "id": "5dfa3589eacea3f48c6300ae",
       "title": "Step 20"
     },
     {
-      "id": "5dfb5ecbeacea3f48c6300b1",
+      "id": "5dfa371beacea3f48c6300af",
       "title": "Step 21"
     },
     {
-      "id": "5dfb6250eacea3f48c6300b2",
+      "id": "5dfa37b9eacea3f48c6300b0",
       "title": "Step 22"
     },
     {
-      "id": "5dfb655eeacea3f48c6300b3",
+      "id": "5dfb5ecbeacea3f48c6300b1",
       "title": "Step 23"
     },
     {
-      "id": "5dfb6a35eacea3f48c6300b4",
+      "id": "5dfb6250eacea3f48c6300b2",
       "title": "Step 24"
     },
     {
-      "id": "5ef9b03c81a63668521804d0",
+      "id": "5dfb655eeacea3f48c6300b3",
       "title": "Step 25"
     },
     {
-      "id": "5ef9b03c81a63668521804d1",
+      "id": "5dfb6a35eacea3f48c6300b4",
       "title": "Step 26"
     },
     {
-      "id": "5ef9b03c81a63668521804d2",
+      "id": "5ef9b03c81a63668521804d0",
       "title": "Step 27"
     },
     {
-      "id": "5ef9b03c81a63668521804d3",
+      "id": "5ef9b03c81a63668521804d1",
       "title": "Step 28"
     },
     {
-      "id": "5efada803cbd2bbdab94e332",
+      "id": "5ef9b03c81a63668521804d2",
       "title": "Step 29"
     },
     {
-      "id": "5efae0543cbd2bbdab94e333",
+      "id": "5ef9b03c81a63668521804d3",
       "title": "Step 30"
     },
     {
-      "id": "5efae16e3cbd2bbdab94e334",
+      "id": "5efada803cbd2bbdab94e332",
       "title": "Step 31"
     },
     {
-      "id": "5ef9b03c81a63668521804d4",
+      "id": "5efae0543cbd2bbdab94e333",
       "title": "Step 32"
     },
     {
-      "id": "5f07fb1579dc934717801375",
+      "id": "5efae16e3cbd2bbdab94e334",
       "title": "Step 33"
     },
     {
-      "id": "5ef9b03c81a63668521804d5",
+      "id": "5ef9b03c81a63668521804d4",
       "title": "Step 34"
     },
     {
-      "id": "5ef9b03c81a63668521804d6",
+      "id": "5f07fb1579dc934717801375",
       "title": "Step 35"
     },
     {
-      "id": "5ef9b03c81a63668521804d7",
+      "id": "5ef9b03c81a63668521804d5",
       "title": "Step 36"
     },
     {
-      "id": "5ef9b03c81a63668521804d8",
+      "id": "5ef9b03c81a63668521804d6",
       "title": "Step 37"
     },
     {
-      "id": "5efb23e70dc218d6c85f89b1",
+      "id": "5ef9b03c81a63668521804d7",
       "title": "Step 38"
     },
     {
-      "id": "7cf9b03d81a65668421804c3",
+      "id": "5ef9b03c81a63668521804d8",
       "title": "Step 39"
     },
     {
-      "id": "5ef9b03c81a63668521804d9",
+      "id": "5efb23e70dc218d6c85f89b1",
       "title": "Step 40"
     },
     {
-      "id": "5ef9b03c81a63668521804db",
+      "id": "7cf9b03d81a65668421804c3",
       "title": "Step 41"
     },
     {
-      "id": "5ef9b03c81a63668521804da",
+      "id": "5ef9b03c81a63668521804d9",
       "title": "Step 42"
     },
     {
-      "id": "5efb2c990dc218d6c85f89b2",
+      "id": "5ef9b03c81a63668521804db",
       "title": "Step 43"
     },
     {
-      "id": "5ef9b03c81a63668521804dc",
+      "id": "5ef9b03c81a63668521804da",
       "title": "Step 44"
     },
     {
-      "id": "5ef9b03c81a63668521804dd",
+      "id": "5efb2c990dc218d6c85f89b2",
       "title": "Step 45"
     },
     {
-      "id": "5ef9b03c81a63668521804df",
+      "id": "5ef9b03c81a63668521804dc",
       "title": "Step 46"
     },
     {
-      "id": "5f05a1d8e233dff4a68508d8",
+      "id": "5ef9b03c81a63668521804dd",
       "title": "Step 47"
     },
     {
-      "id": "5ef9b03c81a63668521804de",
+      "id": "5ef9b03c81a63668521804df",
       "title": "Step 48"
     },
     {
-      "id": "5f1a80975fc4bcae0edb3497",
+      "id": "5f05a1d8e233dff4a68508d8",
       "title": "Step 49"
     },
     {
-      "id": "5ef9b03c81a63668521804e1",
+      "id": "5ef9b03c81a63668521804de",
       "title": "Step 50"
     },
     {
-      "id": "5f0d48e7b435f13ab6550051",
+      "id": "5f1a80975fc4bcae0edb3497",
       "title": "Step 51"
     },
     {
-      "id": "5f0d4ab1b435f13ab6550052",
+      "id": "5ef9b03c81a63668521804e1",
       "title": "Step 52"
     },
     {
-      "id": "5f0d4d04b435f13ab6550053",
+      "id": "5f0d48e7b435f13ab6550051",
       "title": "Step 53"
     },
     {
-      "id": "5ef9b03c81a63668521804e2",
+      "id": "5f0d4ab1b435f13ab6550052",
       "title": "Step 54"
     },
     {
-      "id": "5efc54138d6a74d05e68af76",
+      "id": "5f0d4d04b435f13ab6550053",
       "title": "Step 55"
     },
     {
-      "id": "5efc4f528d6a74d05e68af74",
+      "id": "5ef9b03c81a63668521804e2",
       "title": "Step 56"
     },
     {
-      "id": "5efc518e8d6a74d05e68af75",
+      "id": "5efc54138d6a74d05e68af76",
       "title": "Step 57"
     },
     {
-      "id": "5ef9b03c81a63668521804e3",
+      "id": "5efc4f528d6a74d05e68af74",
       "title": "Step 58"
     },
     {
-      "id": "5efc575c8d6a74d05e68af77",
+      "id": "5efc518e8d6a74d05e68af75",
       "title": "Step 59"
     },
     {
-      "id": "5f1a89f1190aff21ae42105a",
+      "id": "5ef9b03c81a63668521804e3",
       "title": "Step 60"
     },
     {
-      "id": "5ef9b03c81a63668521804e5",
+      "id": "5efc575c8d6a74d05e68af77",
       "title": "Step 61"
     },
     {
-      "id": "5ef9b03c81a63668521804e7",
+      "id": "5f1a89f1190aff21ae42105a",
       "title": "Step 62"
     },
     {
-      "id": "5ef9b03c81a63668521804e8",
+      "id": "5ef9b03c81a63668521804e5",
       "title": "Step 63"
     },
     {
-      "id": "5ef9b03c81a63668521804e9",
+      "id": "5ef9b03c81a63668521804e7",
       "title": "Step 64"
     },
     {
-      "id": "5ef9b03c81a63668521804ea",
+      "id": "5ef9b03c81a63668521804e8",
       "title": "Step 65"
     },
     {
-      "id": "5ef9b03c81a63668521804eb",
+      "id": "5ef9b03c81a63668521804e9",
       "title": "Step 66"
     },
     {
-      "id": "5ef9b03c81a63668521804ec",
+      "id": "5ef9b03c81a63668521804ea",
       "title": "Step 67"
     },
     {
-      "id": "5ef9b03c81a63668521804ee",
+      "id": "5ef9b03c81a63668521804eb",
       "title": "Step 68"
     },
     {
-      "id": "62bb4009e3458a128ff57d5d",
+      "id": "5ef9b03c81a63668521804ec",
       "title": "Step 69"
+    },
+    {
+      "id": "5ef9b03c81a63668521804ee",
+      "title": "Step 70"
+    },
+    {
+      "id": "62bb4009e3458a128ff57d5d",
+      "title": "Step 71"
     }
   ]
 }
diff --git a/...eb-design-22/learn-html-by-building-a-cat-photo-app/5dc17d3bf86c76b9248c6eb4.md b/...eb-design-22/learn-html-by-building-a-cat-photo-app/5dc17d3bf86c76b9248c6eb4.md
@@ -9,7 +9,7 @@ dashedName: step-3
 
 The `p` element is used to create a paragraph of text on websites. Create a `p` element below your `h2` element and give it the following text:
 
-`See more cat photos in our gallery.`
+`Everyone loves cute cats online!`
 
 # --hints--
 
@@ -25,13 +25,13 @@ Your `p` element should have a closing tag. Closing tags have a `/` just after t
 assert(code.match(/<\/p\>/));
 ```
 
-Your `p` element's text should be `See more cat photos in our gallery.` You have either omitted the text or have a typo.
+Your `p` element's text should be `Everyone loves cute cats online!` You have either omitted the text or have a typo.
 
 ```js
 const extraSpacesRemoved = document
   .querySelector('p')
   .innerText.replace(/\s+/g, ' ');
-assert(extraSpacesRemoved.match(/see more cat photos in our gallery\.?$/i));
+assert.match(extraSpacesRemoved, /everyone loves cute cats online!$/i);
 ```
 
 Your `p` element should be below the `h2` element. You have them in the wrong order.

diff --git a/...eb-design-22/learn-html-by-building-a-cat-photo-app/5dc17dc8f86c76b9248c6eb5.md b/...eb-design-22/learn-html-by-building-a-cat-photo-app/5dc17dc8f86c76b9248c6eb5.md
@@ -49,12 +49,9 @@ assert(code.match(/<!--\s*todo:\s+add\s+link\s+to\s+cat\s+photos\s*-->/i));
 Your comment should be above the `p` element. You have them in the wrong order.
 
 ```js
-assert(
-  code
-    .replace(/\s/g, '')
-    .match(
-      /<!--todo:addlinktocatphotos--><p>seemorecatphotosinourgallery\.?<\/p>/i
-    )
+assert.match(
+  code.replace(/\s/g, ''),
+  /<!--todo:addlinktocatphotos--><p>everyonelovescutecatsonline!<\/p>/i
 );
 ```
 
@@ -69,7 +66,7 @@ assert(
     <h2>Cat Photos</h2>
 --fcc-editable-region--
 
-    <p>See more cat photos in our gallery.</p>
+    <p>Everyone loves cute cats online!</p>
 
 --fcc-editable-region--
   </body>

diff --git a/...eb-design-22/learn-html-by-building-a-cat-photo-app/5dc2385ff86c76b9248c6eb7.md b/...eb-design-22/learn-html-by-building-a-cat-photo-app/5dc2385ff86c76b9248c6eb7.md
@@ -55,10 +55,8 @@ Your `main` element's closing tag should be below the `p` element. You have them
 ```js
 const mainNode = document.querySelector('main');
 const pNode = document.querySelector('p');
-assert(
-  mainNode.contains(pNode) &&
-    pNode.textContent.toLowerCase().match(/see more cat photos in our gallery/)
-);
+assert.isTrue(mainNode.contains(pNode));
+assert.match(pNode.textContent.toLowerCase(), /everyone loves cute cats online!/);
 ```
 
 # --seed--
@@ -73,7 +71,7 @@ assert(
     <h1>CatPhotoApp</h1>
     <h2>Cat Photos</h2>
     <!-- TODO: Add link to cat photos -->
-    <p>See more cat photos in our gallery.</p>
+    <p>Everyone loves cute cats online!</p>
 
 --fcc-editable-region--
   </body>