fix: removed assert msg argument (#36406)
This commit is contained in:
committed by
Oliver Eyton-Williams
parent
e763330fc3
commit
87615d2a7b
@@ -23,13 +23,13 @@ Add a button as the last element of your <code>form</code> element with a type o
|
||||
```yml
|
||||
tests:
|
||||
- text: Your form should have a button inside it.
|
||||
testString: assert($("form").children("button").length > 0, 'Your form should have a button inside it.');
|
||||
testString: assert($("form").children("button").length > 0);
|
||||
- text: Your submit button should have the attribute <code>type</code> set to <code>submit</code>.
|
||||
testString: assert($("button").attr("type") === "submit", 'Your submit button should have the attribute <code>type</code> set to <code>submit</code>.');
|
||||
testString: assert($("button").attr("type") === "submit");
|
||||
- text: Your submit button should only have the text "Submit".
|
||||
testString: assert($("button").text().match(/^\s*submit\s*$/gi), 'Your submit button should only have the text "Submit".');
|
||||
testString: assert($("button").text().match(/^\s*submit\s*$/gi));
|
||||
- text: Make sure your <code>button</code> element has a closing tag.
|
||||
testString: assert(code.match(/<\/button>/g) && code.match(/<button/g) && code.match(/<\/button>/g).length === code.match(/<button/g).length, 'Make sure your <code>button</code> element has a closing tag.');
|
||||
testString: assert(code.match(/<\/button>/g) && code.match(/<button/g) && code.match(/<\/button>/g).length === code.match(/<button/g).length);
|
||||
|
||||
```
|
||||
|
||||
|
@@ -23,9 +23,9 @@ Set the first of your <code>radio button</code>s and the first of your <code>che
|
||||
```yml
|
||||
tests:
|
||||
- text: Your first radio button on your form should be checked by default.
|
||||
testString: assert($('input[type="radio"]').prop("checked"), 'Your first radio button on your form should be checked by default.');
|
||||
testString: assert($('input[type="radio"]').prop("checked"));
|
||||
- text: Your first checkbox on your form should be checked by default.
|
||||
testString: assert($('input[type="checkbox"]').prop("checked"), 'Your first checkbox on your form should be checked by default.');
|
||||
testString: assert($('input[type="checkbox"]').prop("checked"));
|
||||
|
||||
```
|
||||
|
||||
|
@@ -22,15 +22,15 @@ Comment out your <code>h1</code> element and your <code>p</code> element, but no
|
||||
```yml
|
||||
tests:
|
||||
- text: Comment out your <code>h1</code> element so that it is not visible on your page.
|
||||
testString: assert(($("h1").length === 0), 'Comment out your <code>h1</code> element so that it is not visible on your page.');
|
||||
testString: assert(($("h1").length === 0));
|
||||
- text: Leave your <code>h2</code> element uncommented so that it is visible on your page.
|
||||
testString: assert(($("h2").length > 0), 'Leave your <code>h2</code> element uncommented so that it is visible on your page.');
|
||||
testString: assert(($("h2").length > 0));
|
||||
- text: Comment out your <code>p</code> element so that it is not visible on your page.
|
||||
testString: assert(($("p").length === 0), 'Comment out your <code>p</code> element so that it is not visible on your page.');
|
||||
testString: assert(($("p").length === 0));
|
||||
- text: Be sure to close each of your comments with <code>--></code>.
|
||||
testString: assert(code.match(/[^fc]-->/g).length > 1, 'Be sure to close each of your comments with <code>--></code>.');
|
||||
testString: assert(code.match(/[^fc]-->/g).length > 1);
|
||||
- text: Do not change the order of the <code>h1</code> <code>h2</code> or <code>p</code> in the code.
|
||||
testString: assert((code.match(/<([a-z0-9]){1,2}>/g)[0]==="<h1>" && code.match(/<([a-z0-9]){1,2}>/g)[1]==="<h2>" && code.match(/<([a-z0-9]){1,2}>/g)[2]==="<p>") , 'Do not change the order of the <code>h1</code> <code>h2</code> or <code>p</code> in the code.');
|
||||
testString: assert((code.match(/<([a-z0-9]){1,2}>/g)[0]==="<h1>" && code.match(/<([a-z0-9]){1,2}>/g)[1]==="<h2>" && code.match(/<([a-z0-9]){1,2}>/g)[2]==="<p>") );
|
||||
|
||||
```
|
||||
|
||||
|
@@ -32,15 +32,15 @@ Remove the last two <code>p</code> elements and create an unordered list of thre
|
||||
```yml
|
||||
tests:
|
||||
- text: Create a <code>ul</code> element.
|
||||
testString: assert($("ul").length > 0, 'Create a <code>ul</code> element.');
|
||||
testString: assert($("ul").length > 0);
|
||||
- text: You should have three <code>li</code> elements within your <code>ul</code> element.
|
||||
testString: assert($("ul li").length > 2, 'You should have three <code>li</code> elements within your <code>ul</code> element.');
|
||||
testString: assert($("ul li").length > 2);
|
||||
- text: Make sure your <code>ul</code> element has a closing tag.
|
||||
testString: assert(code.match(/<\/ul>/gi) && code.match(/<ul/gi) && code.match(/<\/ul>/gi).length === code.match(/<ul/gi).length, 'Make sure your <code>ul</code> element has a closing tag.');
|
||||
testString: assert(code.match(/<\/ul>/gi) && code.match(/<ul/gi) && code.match(/<\/ul>/gi).length === code.match(/<ul/gi).length);
|
||||
- text: Make sure your <code>li</code> elements have closing tags.
|
||||
testString: assert(code.match(/<\/li>/gi) && code.match(/<li[\s>]/gi) && code.match(/<\/li>/gi).length === code.match(/<li[\s>]/gi).length, 'Make sure your <code>li</code> elements have closing tags.');
|
||||
testString: assert(code.match(/<\/li>/gi) && code.match(/<li[\s>]/gi) && code.match(/<\/li>/gi).length === code.match(/<li[\s>]/gi).length);
|
||||
- text: Make sure your <code>li</code> elements don’t contain an empty string or only white-space.
|
||||
testString: assert($("ul li").filter((_, item) => !$(item).text().trim()).length === 0, 'Make sure your <code>li</code> elements don\’t contain an empty string or only white-space.');
|
||||
testString: assert($("ul li").filter((_, item) => !$(item).text().trim()).length === 0);
|
||||
```
|
||||
|
||||
</section>
|
||||
|
@@ -23,11 +23,11 @@ Nest your text field inside a <code>form</code> element, and add the <code>actio
|
||||
```yml
|
||||
tests:
|
||||
- text: Nest your text input element within a <code>form</code> element.
|
||||
testString: assert($("form") && $("form").children("input") && $("form").children("input").length > 0, 'Nest your text input element within a <code>form</code> element.');
|
||||
testString: assert($("form") && $("form").children("input") && $("form").children("input").length > 0);
|
||||
- text: Make sure your <code>form</code> has an <code>action</code> attribute which is set to <code>/submit-cat-photo</code>
|
||||
testString: assert($("form").attr("action") === "/submit-cat-photo", 'Make sure your <code>form</code> has an <code>action</code> attribute which is set to <code>/submit-cat-photo</code>');
|
||||
testString: assert($("form").attr("action") === "/submit-cat-photo");
|
||||
- text: Make sure your <code>form</code> element has well-formed open and close tags.
|
||||
testString: assert(code.match(/<\/form>/g) && code.match(/<form [^<]*>/g) && code.match(/<\/form>/g).length === code.match(/<form [^<]*>/g).length, 'Make sure your <code>form</code> element has well-formed open and close tags.');
|
||||
testString: assert(code.match(/<\/form>/g) && code.match(/<form [^<]*>/g) && code.match(/<\/form>/g).length === code.match(/<form [^<]*>/g).length);
|
||||
|
||||
```
|
||||
|
||||
|
@@ -27,15 +27,15 @@ Add to your form a set of three checkboxes. Each checkbox should be nested withi
|
||||
```yml
|
||||
tests:
|
||||
- text: Your page should have three checkbox elements.
|
||||
testString: assert($('input[type="checkbox"]').length > 2, 'Your page should have three checkbox elements.');
|
||||
testString: assert($('input[type="checkbox"]').length > 2);
|
||||
- text: Each of your three checkbox elements should be nested in its own <code>label</code> element.
|
||||
testString: assert($('label > input[type="checkbox"]:only-child').length > 2, 'Each of your three checkbox elements should be nested in its own <code>label</code> element.');
|
||||
testString: assert($('label > input[type="checkbox"]:only-child').length > 2);
|
||||
- text: Make sure each of your <code>label</code> elements has a closing tag.
|
||||
testString: assert(code.match(/<\/label>/g) && code.match(/<label/g) && code.match(/<\/label>/g).length === code.match(/<label/g).length, 'Make sure each of your <code>label</code> elements has a closing tag.');
|
||||
testString: assert(code.match(/<\/label>/g) && code.match(/<label/g) && code.match(/<\/label>/g).length === code.match(/<label/g).length);
|
||||
- text: Give your checkboxes the <code>name</code> attribute of <code>personality</code>.
|
||||
testString: assert($('label > input[type="checkbox"]').filter('[name="personality"]').length > 2, 'Give your checkboxes the <code>name</code> attribute of <code>personality</code>.');
|
||||
testString: assert($('label > input[type="checkbox"]').filter('[name="personality"]').length > 2);
|
||||
- text: Each of your checkboxes should be added within the <code>form</code> tag.
|
||||
testString: assert($('label').parent().get(0).tagName.match('FORM'), 'Each of your checkboxes should be added within the <code>form</code> tag.');
|
||||
testString: assert($('label').parent().get(0).tagName.match('FORM'));
|
||||
|
||||
```
|
||||
|
||||
|
@@ -40,19 +40,19 @@ Add a pair of radio buttons to your form, each nested in its own <code>label</co
|
||||
```yml
|
||||
tests:
|
||||
- text: Your page should have two radio button elements.
|
||||
testString: assert($('input[type="radio"]').length > 1, 'Your page should have two radio button elements.');
|
||||
testString: assert($('input[type="radio"]').length > 1);
|
||||
- text: Give your radio buttons the <code>name</code> attribute of <code>indoor-outdoor</code>.
|
||||
testString: assert($('input[type="radio"]').filter("[name='indoor-outdoor']").length > 1, 'Give your radio buttons the <code>name</code> attribute of <code>indoor-outdoor</code>.');
|
||||
testString: assert($('input[type="radio"]').filter("[name='indoor-outdoor']").length > 1);
|
||||
- text: Each of your two radio button elements should be nested in its own <code>label</code> element.
|
||||
testString: assert($('label > input[type="radio"]:only-child').length > 1, 'Each of your two radio button elements should be nested in its own <code>label</code> element.');
|
||||
testString: assert($('label > input[type="radio"]:only-child').length > 1);
|
||||
- text: Make sure each of your <code>label</code> elements has a closing tag.
|
||||
testString: assert((code.match(/<\/label>/g) && code.match(/<label/g) && code.match(/<\/label>/g).length === code.match(/<label/g).length), 'Make sure each of your <code>label</code> elements has a closing tag.');
|
||||
testString: assert((code.match(/<\/label>/g) && code.match(/<label/g) && code.match(/<\/label>/g).length === code.match(/<label/g).length));
|
||||
- text: One of your radio buttons should have the label <code>indoor</code>.
|
||||
testString: assert($("label").text().match(/indoor/gi), 'One of your radio buttons should have the label <code>indoor</code>.');
|
||||
testString: assert($("label").text().match(/indoor/gi));
|
||||
- text: One of your radio buttons should have the label <code>outdoor</code>.
|
||||
testString: assert($("label").text().match(/outdoor/gi), 'One of your radio buttons should have the label <code>outdoor</code>.');
|
||||
testString: assert($("label").text().match(/outdoor/gi));
|
||||
- text: Each of your radio button elements should be added within the <code>form</code> tag.
|
||||
testString: assert($("label").parent().get(0).tagName.match('FORM'), 'Each of your radio button elements should be added within the <code>form</code> tag.');
|
||||
testString: assert($("label").parent().get(0).tagName.match('FORM'));
|
||||
|
||||
```
|
||||
|
||||
|
@@ -25,7 +25,7 @@ Create an <code>input</code> element of type <code>text</code> below your lists.
|
||||
```yml
|
||||
tests:
|
||||
- text: Your app should have an <code>input</code> element of type <code>text</code>.
|
||||
testString: assert($("input[type=text]").length > 0, 'Your app should have an <code>input</code> element of type <code>text</code>.');
|
||||
testString: assert($("input[type=text]").length > 0);
|
||||
|
||||
```
|
||||
|
||||
|
@@ -33,23 +33,23 @@ Create an ordered list of the top 3 things cats hate the most.
|
||||
```yml
|
||||
tests:
|
||||
- text: You should have an ordered list for "Top 3 things cats hate:"
|
||||
testString: assert((/Top 3 things cats hate:/i).test($("ol").prev().text()), 'You should have an ordered list for "Top 3 things cats hate:"');
|
||||
testString: assert((/Top 3 things cats hate:/i).test($("ol").prev().text()));
|
||||
- text: You should have an unordered list for "Things cats love:"
|
||||
testString: assert((/Things cats love:/i).test($("ul").prev().text()), 'You should have an unordered list for "Things cats love:"');
|
||||
testString: assert((/Things cats love:/i).test($("ul").prev().text()));
|
||||
- text: You should have only one <code>ul</code> element.
|
||||
testString: assert.equal($("ul").length, 1, 'You should have only one <code>ul</code> element.');
|
||||
testString: assert.equal($("ul").length, 1);
|
||||
- text: You should have only one <code>ol</code> element.
|
||||
testString: assert.equal($("ol").length, 1, 'You should have only one <code>ol</code> element.');
|
||||
testString: assert.equal($("ol").length, 1);
|
||||
- text: You should have three <code>li</code> elements within your <code>ul</code> element.
|
||||
testString: assert.equal($("ul li").length, 3, 'You should have three <code>li</code> elements within your <code>ul</code> element.');
|
||||
testString: assert.equal($("ul li").length, 3);
|
||||
- text: You should have three <code>li</code> elements within your <code>ol</code> element.
|
||||
testString: assert.equal($("ol li").length, 3, 'You should have three <code>li</code> elements within your <code>ol</code> element.');
|
||||
testString: assert.equal($("ol li").length, 3);
|
||||
- text: Make sure your <code>ul</code> element has a closing tag.
|
||||
testString: assert(code.match(/<\/ul>/g) && code.match(/<\/ul>/g).length === code.match(/<ul>/g).length, 'Make sure your <code>ul</code> element has a closing tag.');
|
||||
testString: assert(code.match(/<\/ul>/g) && code.match(/<\/ul>/g).length === code.match(/<ul>/g).length);
|
||||
- text: Make sure your <code>ol</code> element has a closing tag.
|
||||
testString: assert(code.match(/<\/ol>/g) && code.match(/<\/ol>/g).length === code.match(/<ol>/g).length, 'Make sure your <code>ol</code> element has a closing tag.');
|
||||
testString: assert(code.match(/<\/ol>/g) && code.match(/<\/ol>/g).length === code.match(/<ol>/g).length);
|
||||
- text: Make sure your <code>li</code> element has a closing tag.
|
||||
testString: assert(code.match(/<\/li>/g) && code.match(/<li>/g) && code.match(/<\/li>/g).length === code.match(/<li>/g).length, 'Make sure your <code>li</code> element has a closing tag.');
|
||||
testString: assert(code.match(/<\/li>/g) && code.match(/<li>/g) && code.match(/<\/li>/g).length === code.match(/<li>/g).length);
|
||||
- text: The <code>li</code> elements in your unordered list should not be empty.
|
||||
testString: $('ul li').each((i, val) => assert(val.textContent.replace(/\s/g, ''), 'Your <code>li</code> elements in your unordered list should not be empty.'));
|
||||
- text: The <code>li</code> elements in your ordered list should not be empty.
|
||||
|
@@ -34,11 +34,11 @@ Add a <code>DOCTYPE</code> tag for HTML5 to the top of the blank HTML document i
|
||||
```yml
|
||||
tests:
|
||||
- text: Your code should include a <code><!DOCTYPE html></code> tag.
|
||||
testString: assert(code.match(/<!DOCTYPE\s+?html\s*?>/gi), 'Your code should include a <code><!DOCTYPE html></code> tag.');
|
||||
testString: assert(code.match(/<!DOCTYPE\s+?html\s*?>/gi));
|
||||
- text: There should be one <code>html</code> element.
|
||||
testString: assert($('html').length == 1, 'There should be one <code>html</code> element.');
|
||||
testString: assert($('html').length == 1);
|
||||
- text: The <code>html</code> tags should wrap around one <code>h1</code> element.
|
||||
testString: assert(code.match(/<html>\s*?<h1>\s*?.*?\s*?<\/h1>\s*?<\/html>/gi), 'The <code>html</code> tags should wrap around one <code>h1</code> element.');
|
||||
testString: assert(code.match(/<html>\s*?<h1>\s*?.*?\s*?<\/h1>\s*?<\/html>/gi));
|
||||
|
||||
```
|
||||
|
||||
|
@@ -36,17 +36,17 @@ Edit the markup so there's a <code>head</code> and a <code>body</code>. The <cod
|
||||
```yml
|
||||
tests:
|
||||
- text: There should be only one <code>head</code> element on the page.
|
||||
testString: assert($('head').length == 1, 'There should be only one <code>head</code> element on the page.');
|
||||
testString: assert($('head').length == 1);
|
||||
- text: There should be only one <code>body</code> element on the page.
|
||||
testString: assert($('body').length == 1, 'There should be only one <code>body</code> element on the page.');
|
||||
testString: assert($('body').length == 1);
|
||||
- text: The <code>head</code> element should be a child of the <code>html</code> element.
|
||||
testString: assert($('html').children('head').length == 1, 'The <code>head</code> element should be a child of the <code>html</code> element.');
|
||||
testString: assert($('html').children('head').length == 1);
|
||||
- text: The <code>body</code> element should be a child of the <code>html</code> element.
|
||||
testString: assert($('html').children('body').length == 1, 'The <code>body</code> element should be a child of the <code>html</code> element.');
|
||||
testString: assert($('html').children('body').length == 1);
|
||||
- text: The <code>head</code> element should wrap around the <code>title</code> element.
|
||||
testString: assert(code.match(/<head>\s*?<title>\s*?.*?\s*?<\/title>\s*?<\/head>/gi), 'The <code>head</code> element should wrap around the <code>title</code> element.');
|
||||
- text: The <code>body</code> element should wrap around both the <code>h1</code> and <code>p</code> .
|
||||
testString: assert(code.match(/<body>\s*?(((<h1>\s*?.*?\s*?<\/h1>\s*?)(<p>(.*\s*)*?<\/p>\s*?))|((<p>\s*?.*?\s*?<\/p>\s*?)(<h1>(.*\s*)*?<\/h1>\s*?)))<\/body>/gi), 'The <code>body</code> element should wrap around both the <code>h1</code>and <code>p</code> elements');
|
||||
testString: assert(code.match(/<head>\s*?<title>\s*?.*?\s*?<\/title>\s*?<\/head>/gi));
|
||||
- text: The <code>body</code> element should wrap around both the <code>h1</code> and <code>p</code> elements.
|
||||
testString: assert(code.match(/<body>\s*?(((<h1>\s*?.*?\s*?<\/h1>\s*?)(<p>(.*\s*)*?<\/p>\s*?))|((<p>\s*?.*?\s*?<\/p>\s*?)(<h1>(.*\s*)*?<\/h1>\s*?)))<\/body>/gi));
|
||||
|
||||
```
|
||||
|
||||
|
@@ -22,11 +22,11 @@ Delete your <code>h1</code> element so we can simplify our view.
|
||||
```yml
|
||||
tests:
|
||||
- text: Delete your <code>h1</code> element.
|
||||
testString: assert(!code.match(/<h1>/gi) && !code.match(/<\/h1>/gi), 'Delete your <code>h1</code> element.');
|
||||
testString: assert(!code.match(/<h1>/gi) && !code.match(/<\/h1>/gi));
|
||||
- text: Leave your <code>h2</code> element on the page.
|
||||
testString: assert(code.match(/<h2>[\w\W]*<\/h2>/gi), 'Leave your <code>h2</code> element on the page.');
|
||||
testString: assert(code.match(/<h2>[\w\W]*<\/h2>/gi));
|
||||
- text: Leave your <code>p</code> element on the page.
|
||||
testString: assert(code.match(/<p>[\w\W]*<\/p>/gi), 'Leave your <code>p</code> element on the page.');
|
||||
testString: assert(code.match(/<p>[\w\W]*<\/p>/gi));
|
||||
|
||||
```
|
||||
|
||||
|
@@ -23,7 +23,7 @@ Replace the text inside your <code>p</code> element with the first few words of
|
||||
```yml
|
||||
tests:
|
||||
- text: Your <code>p</code> element should contain the first few words of the provided <code>kitty ipsum text</code>.
|
||||
testString: assert.isTrue((/Kitty(\s)+ipsum/gi).test($("p").text()), 'Your <code>p</code> element should contain the first few words of the provided <code>kitty ipsum text</code>.');
|
||||
testString: assert.isTrue((/Kitty(\s)+ipsum/gi).test($("p").text()));
|
||||
|
||||
```
|
||||
|
||||
|
@@ -23,13 +23,13 @@ Add an <code>h2</code> tag that says "CatPhotoApp" to create a second HTML <code
|
||||
```yml
|
||||
tests:
|
||||
- text: Create an <code>h2</code> element.
|
||||
testString: assert(($("h2").length > 0), 'Create an <code>h2</code> element.');
|
||||
testString: assert(($("h2").length > 0));
|
||||
- text: Make sure your <code>h2</code> element has a closing tag.
|
||||
testString: assert(code.match(/<\/h2>/g) && code.match(/<\/h2>/g).length === code.match(/<h2>/g).length, 'Make sure your <code>h2</code> element has a closing tag.');
|
||||
testString: assert(code.match(/<\/h2>/g) && code.match(/<\/h2>/g).length === code.match(/<h2>/g).length);
|
||||
- text: Your <code>h2</code> element should have the text "CatPhotoApp".
|
||||
testString: assert.isTrue((/cat(\s)?photo(\s)?app/gi).test($("h2").text()), 'Your <code>h2</code> element should have the text "CatPhotoApp".');
|
||||
testString: assert.isTrue((/cat(\s)?photo(\s)?app/gi).test($("h2").text()));
|
||||
- text: Your <code>h1</code> element should have the text "Hello World".
|
||||
testString: assert.isTrue((/hello(\s)+world/gi).test($("h1").text()), 'Your <code>h1</code> element should have the text "Hello World".');
|
||||
testString: assert.isTrue((/hello(\s)+world/gi).test($("h1").text()));
|
||||
|
||||
```
|
||||
|
||||
|
@@ -23,12 +23,12 @@ Create a <code>p</code> element below your <code>h2</code> element, and give it
|
||||
|
||||
```yml
|
||||
tests:
|
||||
- text: Create a <code>p</code> element.
|
||||
testString: assert(($("p").length > 0), 'Create a valid <code>p</code> element.');
|
||||
- text: Your code should have a valid <code>p</code> element.
|
||||
testString: assert(($("p").length > 0));
|
||||
- text: Your <code>p</code> element should have the text "Hello Paragraph".
|
||||
testString: assert.isTrue((/hello(\s)+paragraph/gi).test($("p").text()), 'Your <code>p</code> element should have the text "Hello Paragraph".');
|
||||
testString: assert.isTrue((/hello(\s)+paragraph/gi).test($("p").text()));
|
||||
- text: Make sure your <code>p</code> element has a closing tag.
|
||||
testString: assert(code.match(/<\/p>/g) && code.match(/<\/p>/g).length === code.match(/<p/g).length, 'Make sure your <code>p</code> element has a closing tag.');
|
||||
testString: assert(code.match(/<\/p>/g) && code.match(/<\/p>/g).length === code.match(/<p/g).length);
|
||||
|
||||
```
|
||||
|
||||
|
@@ -33,19 +33,19 @@ Then, create a <code>main</code> element and nest the two <code>p</code> element
|
||||
```yml
|
||||
tests:
|
||||
- text: You need 2 <code>p</code> elements with Kitty Ipsum text.
|
||||
testString: assert($("p").length > 1, 'You need 2 <code>p</code> elements with Kitty Ipsum text.');
|
||||
testString: assert($("p").length > 1);
|
||||
- text: Make sure each of your <code>p</code> elements has a closing tag.
|
||||
testString: assert(code.match(/<\/p>/g) && code.match(/<\/p>/g).length === code.match(/<p/g).length, 'Make sure each of your <code>p</code> elements has a closing tag.');
|
||||
testString: assert(code.match(/<\/p>/g) && code.match(/<\/p>/g).length === code.match(/<p/g).length);
|
||||
- text: Your <code>p</code> element should contain the first few words of the provided additional <code>kitty ipsum text</code>.
|
||||
testString: assert.isTrue((/Purr\s+jump\s+eat/gi).test($("p").text()), 'Your <code>p</code> element should contain the first few words of the provided additional <code>kitty ipsum text</code>.');
|
||||
testString: assert.isTrue((/Purr\s+jump\s+eat/gi).test($("p").text()));
|
||||
- text: Your code should have one <code>main</code> element.
|
||||
testString: assert($('main').length === 1, 'Your code should have one <code>main</code> element.');
|
||||
testString: assert($('main').length === 1);
|
||||
- text: The <code>main</code> element should have two paragraph elements as children.
|
||||
testString: assert($("main").children("p").length === 2, 'The <code>main</code> element should have two paragraph elements as children.');
|
||||
testString: assert($("main").children("p").length === 2);
|
||||
- text: The opening <code>main</code> tag should come before the first paragraph tag.
|
||||
testString: assert(code.match(/<main>\s*?<p>/g), 'The opening <code>main</code> tag should come before the first paragraph tag.');
|
||||
testString: assert(code.match(/<main>\s*?<p>/g));
|
||||
- text: The closing <code>main</code> tag should come after the second closing paragraph tag.
|
||||
testString: assert(code.match(/<\/p>\s*?<\/main>/g), 'The closing <code>main</code> tag should come after the second closing paragraph tag.');
|
||||
testString: assert(code.match(/<\/p>\s*?<\/main>/g));
|
||||
|
||||
```
|
||||
|
||||
|
@@ -24,11 +24,11 @@ Create an <code>a</code> element that links to <code>http://freecatphotoapp.com<
|
||||
```yml
|
||||
tests:
|
||||
- text: Your <code>a</code> element should have the <code>anchor text</code> of "cat photos".
|
||||
testString: assert((/cat photos/gi).test($("a").text()), 'Your <code>a</code> element should have the <code>anchor text</code> of "cat photos".');
|
||||
testString: assert((/cat photos/gi).test($("a").text()));
|
||||
- text: You need an <code>a</code> element that links to <code>http://freecatphotoapp<wbr>.com</code>
|
||||
testString: assert(/http:\/\/(www\.)?freecatphotoapp\.com/gi.test($("a").attr("href")), 'You need an <code>a</code> element that links to <code>http://freecatphotoapp<wbr>.com</code>');
|
||||
testString: assert(/http:\/\/(www\.)?freecatphotoapp\.com/gi.test($("a").attr("href")));
|
||||
- text: Make sure your <code>a</code> element has a closing tag.
|
||||
testString: assert(code.match(/<\/a>/g) && code.match(/<\/a>/g).length === code.match(/<a/g).length, 'Make sure your <code>a</code> element has a closing tag.');
|
||||
testString: assert(code.match(/<\/a>/g) && code.match(/<\/a>/g).length === code.match(/<a/g).length);
|
||||
|
||||
```
|
||||
|
||||
|
@@ -33,17 +33,17 @@ Then add an <code>id</code> attribute with a value of "footer" to the <code><
|
||||
```yml
|
||||
tests:
|
||||
- text: There should be only one anchor tag on your page.
|
||||
testString: assert($('a').length == 1, 'There should be only one anchor tag on your page.');
|
||||
testString: assert($('a').length == 1);
|
||||
- text: There should be only one <code>footer</code> tag on your page.
|
||||
testString: assert($('footer').length == 1, 'There should be only one <code>footer</code> tag on your page.');
|
||||
testString: assert($('footer').length == 1);
|
||||
- text: The <code>a</code> tag should have an <code>href</code> attribute set to "#footer".
|
||||
testString: assert($('a').eq(0).attr('href') == "#footer", 'The <code>a</code> tag should have an <code>href</code> attribute set to "#footer".');
|
||||
testString: assert($('a').eq(0).attr('href') == "#footer");
|
||||
- text: The <code>a</code> tag should not have a <code>target</code> attribute
|
||||
testString: assert(typeof $('a').eq(0).attr('target') == typeof undefined || $('a').eq(0).attr('target') == true, 'The <code>a</code> tag should not have a <code>target</code> attribute');
|
||||
testString: assert(typeof $('a').eq(0).attr('target') == typeof undefined || $('a').eq(0).attr('target') == true);
|
||||
- text: The <code>a</code> text should be "Jump to Bottom".
|
||||
testString: assert($('a').eq(0).text().match(/Jump to Bottom/gi), 'The <code>a</code> text should be "Jump to Bottom".');
|
||||
testString: assert($('a').eq(0).text().match(/Jump to Bottom/gi));
|
||||
- text: The <code>footer</code> tag should have an <code>id</code> attribute set to "footer".
|
||||
testString: assert($('footer').eq(0).attr('id') == "footer", 'The <code>footer</code> tag should have an <code>id</code> attribute set to "footer".');
|
||||
testString: assert($('footer').eq(0).attr('id') == "footer");
|
||||
|
||||
```
|
||||
|
||||
|
@@ -23,7 +23,7 @@ For example: <code>href="#"</code>
|
||||
```yml
|
||||
tests:
|
||||
- text: Your <code>a</code> element should be a dead link with the value of the <code>href</code> attribute set to "#".
|
||||
testString: assert($("a").attr("href") === "#", 'Your <code>a</code> element should be a dead link with the value of the <code>href</code> attribute set to "#".');
|
||||
testString: assert($("a").attr("href") === "#");
|
||||
|
||||
```
|
||||
|
||||
|
@@ -37,21 +37,21 @@ Now nest the existing <code>a</code> element within a new <code>p</code> element
|
||||
```yml
|
||||
tests:
|
||||
- text: You need an <code>a</code> element that links to "http://freecatphotoapp.com".
|
||||
testString: assert(($("a[href=\"http://freecatphotoapp.com\"]").length > 0 || $("a[href=\"http://www.freecatphotoapp.com\"]").length > 0), 'You need an <code>a</code> element that links to "http://freecatphotoapp.com".');
|
||||
testString: assert(($("a[href=\"http://freecatphotoapp.com\"]").length > 0 || $("a[href=\"http://www.freecatphotoapp.com\"]").length > 0));
|
||||
- text: Your <code>a</code> element should have the anchor text of "cat photos"
|
||||
testString: assert($("a").text().match(/cat\sphotos/gi), 'Your <code>a</code> element should have the anchor text of "cat photos"');
|
||||
testString: assert($("a").text().match(/cat\sphotos/gi));
|
||||
- text: Create a new <code>p</code> element around your <code>a</code> element. There should be at least 3 total <code>p</code> tags in your HTML code.
|
||||
testString: assert($("p") && $("p").length > 2, 'Create a new <code>p</code> element around your <code>a</code> element. There should be at least 3 total <code>p</code> tags in your HTML code.');
|
||||
testString: assert($("p") && $("p").length > 2);
|
||||
- text: Your <code>a</code> element should be nested within your new <code>p</code> element.
|
||||
testString: assert(($("a[href=\"http://freecatphotoapp.com\"]").parent().is("p") || $("a[href=\"http://www.freecatphotoapp.com\"]").parent().is("p")), 'Your <code>a</code> element should be nested within your new <code>p</code> element.');
|
||||
testString: assert(($("a[href=\"http://freecatphotoapp.com\"]").parent().is("p") || $("a[href=\"http://www.freecatphotoapp.com\"]").parent().is("p")));
|
||||
- text: Your <code>p</code> element should have the text "View more " (with a space after it).
|
||||
testString: assert(($("a[href=\"http://freecatphotoapp.com\"]").parent().text().match(/View\smore\s/gi) || $("a[href=\"http://www.freecatphotoapp.com\"]").parent().text().match(/View\smore\s/gi)), 'Your <code>p</code> element should have the text "View more " (with a space after it).');
|
||||
testString: assert(($("a[href=\"http://freecatphotoapp.com\"]").parent().text().match(/View\smore\s/gi) || $("a[href=\"http://www.freecatphotoapp.com\"]").parent().text().match(/View\smore\s/gi)));
|
||||
- text: Your <code>a</code> element should <em>not</em> have the text "View more".
|
||||
testString: assert(!$("a").text().match(/View\smore/gi), 'Your <code>a</code> element should <em>not</em> have the text "View more".');
|
||||
testString: assert(!$("a").text().match(/View\smore/gi));
|
||||
- text: Make sure each of your <code>p</code> elements has a closing tag.
|
||||
testString: assert(code.match(/<\/p>/g) && code.match(/<p/g) && code.match(/<\/p>/g).length === code.match(/<p/g).length, 'Make sure each of your <code>p</code> elements has a closing tag.');
|
||||
testString: assert(code.match(/<\/p>/g) && code.match(/<p/g) && code.match(/<\/p>/g).length === code.match(/<p/g).length);
|
||||
- text: Make sure each of your <code>a</code> elements has a closing tag.
|
||||
testString: assert(code.match(/<\/a>/g) && code.match(/<a/g) && code.match(/<\/a>/g).length === code.match(/<a/g).length, 'Make sure each of your <code>a</code> elements has a closing tag.');
|
||||
testString: assert(code.match(/<\/a>/g) && code.match(/<a/g) && code.match(/<\/a>/g).length === code.match(/<a/g).length);
|
||||
|
||||
```
|
||||
|
||||
|
@@ -24,13 +24,13 @@ Hint: Try putting your opening <code>div</code> tag above your "Things cats love
|
||||
```yml
|
||||
tests:
|
||||
- text: Nest your <code>p</code> elements inside your <code>div</code> element.
|
||||
testString: assert($("div").children("p").length > 1, 'Nest your <code>p</code> elements inside your <code>div</code> element.');
|
||||
testString: assert($("div").children("p").length > 1);
|
||||
- text: Nest your <code>ul</code> element inside your <code>div</code> element.
|
||||
testString: assert($("div").children("ul").length > 0, 'Nest your <code>ul</code> element inside your <code>div</code> element.');
|
||||
testString: assert($("div").children("ul").length > 0);
|
||||
- text: Nest your <code>ol</code> element inside your <code>div</code> element.
|
||||
testString: assert($("div").children("ol").length > 0, 'Nest your <code>ol</code> element inside your <code>div</code> element.');
|
||||
testString: assert($("div").children("ol").length > 0);
|
||||
- text: Make sure your <code>div</code> element has a closing tag.
|
||||
testString: assert(code.match(/<\/div>/g) && code.match(/<\/div>/g).length === code.match(/<div>/g).length, 'Make sure your <code>div</code> element has a closing tag.');
|
||||
testString: assert(code.match(/<\/div>/g) && code.match(/<\/div>/g).length === code.match(/<div>/g).length);
|
||||
|
||||
```
|
||||
|
||||
|
@@ -30,7 +30,7 @@ To pass the test on this challenge, change your <code>h1</code> element's text t
|
||||
```yml
|
||||
tests:
|
||||
- text: Your <code>h1</code> element should have the text "Hello World".
|
||||
testString: assert.isTrue((/hello(\s)+world/gi).test($('h1').text()), 'Your <code>h1</code> element should have the text "Hello World".');
|
||||
testString: assert.isTrue((/hello(\s)+world/gi).test($('h1').text()));
|
||||
|
||||
```
|
||||
|
||||
|
@@ -25,11 +25,11 @@ Once you've done this, hover over your image with your cursor. Your cursor's nor
|
||||
```yml
|
||||
tests:
|
||||
- text: Nest the existing <code>img</code> element within an <code>a</code> element.
|
||||
testString: assert($("a").children("img").length > 0, 'Nest the existing <code>img</code> element within an <code>a</code> element.');
|
||||
testString: assert($("a").children("img").length > 0);
|
||||
- text: Your <code>a</code> element should be a dead link with a <code>href</code> attribute set to <code>#</code>.
|
||||
testString: assert(new RegExp("#").test($("a").children("img").parent().attr("href")), 'Your <code>a</code> element should be a dead link with a <code>href</code> attribute set to <code>#</code>.');
|
||||
testString: assert(new RegExp("#").test($("a").children("img").parent().attr("href")));
|
||||
- text: Make sure each of your <code>a</code> elements has a closing tag.
|
||||
testString: assert(code.match(/<\/a>/g) && code.match(/<a/g) && code.match(/<\/a>/g).length === code.match(/<a/g).length, 'Make sure each of your <code>a</code> elements has a closing tag.');
|
||||
testString: assert(code.match(/<\/a>/g) && code.match(/<a/g) && code.match(/<\/a>/g).length === code.match(/<a/g).length);
|
||||
|
||||
```
|
||||
|
||||
|
@@ -23,11 +23,11 @@ Uncomment your <code>h1</code>, <code>h2</code> and <code>p</code> elements.
|
||||
```yml
|
||||
tests:
|
||||
- text: Make your <code>h1</code> element visible on your page by uncommenting it.
|
||||
testString: assert($("h1").length > 0, 'Make your <code>h1</code> element visible on your page by uncommenting it.');
|
||||
testString: assert($("h1").length > 0);
|
||||
- text: Make your <code>h2</code> element visible on your page by uncommenting it.
|
||||
testString: assert($("h2").length > 0, 'Make your <code>h2</code> element visible on your page by uncommenting it.');
|
||||
testString: assert($("h2").length > 0);
|
||||
- text: Make your <code>p</code> element visible on your page by uncommenting it.
|
||||
testString: assert($("p").length > 0, 'Make your <code>p</code> element visible on your page by uncommenting it.');
|
||||
testString: assert($("p").length > 0);
|
||||
- text: Be sure to delete all trailing comment tags, i.e. <code>--></code>.
|
||||
testString: assert(!/[^fc]-->/gi.test(code.replace(/ *<!--[^fc]*\n/g,'')), 'Be sure to delete all trailing comment tags, i.e. <code>--></code>.');
|
||||
|
||||
|
@@ -23,7 +23,7 @@ Then try to submit the form without inputting any text. See how your HTML5 form
|
||||
```yml
|
||||
tests:
|
||||
- text: Your text <code>input</code> element should have the <code>required</code> attribute.
|
||||
testString: assert($("input").prop("required"), 'Your text <code>input</code> element should have the <code>required</code> attribute.');
|
||||
testString: assert($("input").prop("required"));
|
||||
|
||||
```
|
||||
|
||||
|
Reference in New Issue
Block a user