Skip to content

Commit 90e5239

Browse files
tommygonzalezatommygonzaleza
committed
Some details added to the tests
1 parent 3047ec2 commit 90e5239

File tree

14 files changed

+37
-100
lines changed

14 files changed

+37
-100
lines changed

‎exercises/04.3-id-Selector/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,6 @@
88
</head>
99

1010
<body>
11-
<span id="button1">I should look like a button</span>
11+
<span>I should look like a button</span>
1212
</body>
1313
</html>

‎exercises/04.3-id-Selector/test.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@ test("There should be a span tag", () => {
1515
test("The span tag should have id 'button1'", () => {
1616
expect(span).toBeTruthy();
1717
let id = span.id
18+
expect(id).toBeTruthy();
1819
expect(id).toBe('button1');
1920
});
2021

‎exercises/06-Practicing-Rules/README.es.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -10,11 +10,11 @@
1010

1111
4. Haz todos los `h2` tengan subrayado.
1212

13-
5. Centra el `h1`.
13+
5. Agrega un `left padding` a todo el documento de `20px` para que sea más fácil de leer.
1414

15-
6. Agrega un `left padding` a todo el documento de `20px` para que sea más fácil de leer.
15+
6. Agrega un fondo blanco semitransparente (`semi-transparent background 0.2`) al primer párrafo de "3 reasons you know you are learning" para que sea más fácil de leer (tienes que usar `rgba` para esto).
1616

17-
7. Agrega un fondo blanco semitransparente (`semi-transparent background 0.2`) al primer párrafo de "3 reasons you know you are learning" para que sea más fácil de leer (tienes que usar `rgba` para esto), y luego aplica un `padding` de `5px` a todos los lados de ese párrafo.
17+
7. Luego aplica un `padding` de `5px` a todos los lados de ese párrafo.
1818

1919
8. Cambia el color del `anchor` "hover" a verde (`green`) y elimina el subrayado (tienes que colocar el anchor para probarlo).
2020

‎exercises/06-Practicing-Rules/README.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -14,11 +14,11 @@ tutorial: "https://www.youtube.com/watch?v=4wguurrl-lU"
1414

1515
4. Make all the `h2's` with an `underline`.
1616

17-
5. Center the `h1` to the middle.
17+
5. Add a `left padding` to the whole document of `20px` to make it easier to read.
1818

19-
6. Add a `left padding` to the whole document of `20px` to make it easier to read.
19+
6. Add a white `semi-transparent background (0.2)` to the `first paragraph` to make it easier to read (you have tu use `rgba` for that) and write down "3 reasons you know you are learning".
2020

21-
7. Add a white `semi-transparent background (0.2)` to the `first paragraph` to make it easier to read (you have tu use `rgba` for that) and write down "3 reasons you know you are learning". Then apply a `padding` of `5px` to all sides of that paragraph.
21+
7. Then apply a `padding` of `5px` to all sides of that paragraph.
2222

2323
8. Change the `anchor` "hover" color to `green` and remove the underline (you have to actually hover the anchor to test it).
2424

‎exercises/06-Practicing-Rules/index.html

Lines changed: 22 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -8,25 +8,27 @@
88
</head>
99

1010
<body>
11-
<h1>The learning essay</h1>
12-
<h2>3 reasons you know you are learning</h2>
13-
<p id="id1">
14-
We are going to explain in this pharagraph the 3 most comon signs that you should look into yourself to recognize if you are learning.
15-
</p>
16-
<ol>
17-
<li>You are able to complete the exercises by yourself.</li>
18-
<li>You understand what the teacher is talking about</li>
19-
<li>Your are able to have conversations about the topic</li>
20-
</ol>
21-
<h2>3 reasons you know love what you are learning</h2>
22-
<ul>
23-
<li>Time passes fast.</li>
24-
<li>You are anxious to finish this excercise and start the next one.</li>
25-
<li>Is 12am and you don't want to go to sleep.</li>
26-
</ul>
27-
<p>
28-
If you can't sleep, what better than watching videos of cats?
29-
<a href="https://www.youtube.com/watch?v=WEgWMOzQ8IE">click here</a>
30-
</p>
11+
<div style="width: 640px">
12+
<h1>The learning essay</h1>
13+
<h2>3 reasons you know you are learning</h2>
14+
<p id="id1">
15+
We are going to explain in this pharagraph the 3 most comon signs that you should look into yourself to recognize if you are learning.
16+
</p>
17+
<ol>
18+
<li>You are able to complete the exercises by yourself.</li>
19+
<li>You understand what the teacher is talking about</li>
20+
<li>Your are able to have conversations about the topic</li>
21+
</ol>
22+
<h2>3 reasons you know love what you are learning</h2>
23+
<ul>
24+
<li>Time passes fast.</li>
25+
<li>You are anxious to finish this excercise and start the next one.</li>
26+
<li>Is 12am and you don't want to go to sleep.</li>
27+
</ul>
28+
<p>
29+
If you can't sleep, what better than watching videos of cats?
30+
<a href="https://www.youtube.com/watch?v=WEgWMOzQ8IE">click here</a>
31+
</p>
32+
</div>
3133
</body>
3234
</html>

‎exercises/06-Practicing-Rules/solution.hide.css

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,6 @@ body {
1313
h1 {
1414
font-family: "Courier";
1515
color: red;
16-
text-align: center;
1716
}
1817

1918
h2 {

‎exercises/06-Practicing-Rules/styles.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
/* add your styles here */
1+
/* add your styles here */

‎exercises/06-Practicing-Rules/tests.js

Lines changed: 1 addition & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -55,15 +55,6 @@ describe("All the styles should be applied", () => {
5555
// get computed styles of any element you like
5656
expect(h1TagStyles["color"]).toBe("red");
5757
});
58-
test("the text-align in the H1 Tag should be 'center'", () => {
59-
document.querySelector(
60-
"head"
61-
).innerHTML = `<style>${css.toString()}</style>`;
62-
let h1Tag = document.querySelector("h1");
63-
let h1TagStyles = window.getComputedStyle(h1Tag);
64-
// get computed styles of any element you like
65-
expect(h1TagStyles["text-align"]).toBe("center");
66-
});
6758
test("the text-decoration in the H2 Tag should be 'underline'", () => {
6859
document.querySelector(
6960
"head"
@@ -82,15 +73,7 @@ describe("All the styles should be applied", () => {
8273
let idTagStyles = window.getComputedStyle(idTag);
8374
expect(idTagStyles["padding"]).toBe("5px");
8475
});
85-
test("the background-color in the #id1 Tag should be 'semi transparent white'", () => {
86-
document.querySelector(
87-
"head"
88-
).innerHTML = `<style>${css.toString()}</style>`;
89-
// get computed styles of any element you like
90-
const idTag = document.querySelector("#id1");
91-
let idTagStyles = window.getComputedStyle(idTag);
92-
expect(idTagStyles["background-color"]).toBe("rgba(255, 255, 255, 0.2)");
93-
});
76+
9477
test("The a hover underline should be removed", () => {
9578
document.querySelector(
9679
"head"

‎exercises/07-Very-Specific-Rules/solution.hide.css

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
/** Insert your code here **/
2+
23
ul li {
3-
color: red;
4+
color: red !important;
45
}
56

67
ol li:nth-child(2) {
@@ -10,6 +11,7 @@ ol li:nth-child(2) {
1011
tr:nth-child(odd) {
1112
background: yellow;
1213
}
14+
1315
/*********** READ ONLY BLOCK ******
1416
You CANNOT UPDATE anything from here on,
1517
only add lines of code on top of this lines

‎exercises/07-Very-Specific-Rules/styles.css

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
/** Insert your code here **/
22

33

4+
45
/*********** READ ONLY BLOCK ******
56
You CANNOT UPDATE anything from here on,
67
only add lines of code on top of this lines

‎exercises/07-Very-Specific-Rules/tests.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ describe("All the styles should be applied", ()=>{
2424
color = cssArray[i].cssText;
2525
}
2626
}
27-
let reg = new RegExp(/\s*color:\s*red\s*!important\s*;\s*/gm)
27+
let reg = new RegExp(/color:\s*red\s*!important\s*;/gm)
2828

2929
expect(reg.test(color)).toBeTruthy();
3030
});

‎exercises/08-Rounded-Image/tests.js

Lines changed: 0 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -42,15 +42,6 @@ describe("All the styles should be applied", () => {
4242
expect(height).toBe(width);
4343
});
4444

45-
test("the border radius of the img Tag should be '100%'", () => {
46-
document.querySelector(
47-
"head"
48-
).innerHTML = `<style>${css.toString()}</style>`;
49-
50-
let imgStyle = window.getComputedStyle(img);
51-
expect(imgStyle["border-radius"]).toBe("100%");
52-
});
53-
5445
test("the object-fit value of the img Tag should be 'cover'", () => {
5546
document.querySelector(
5647
"head"

‎exercises/12-Relative-Length-EM-REM/tests.js

Lines changed: 0 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -28,23 +28,6 @@ describe("All the styles should be applied", ()=>{
2828
var styles = window.getComputedStyle(h3Tag);
2929
expect(styles["font-size"]).toBe("0.8rem");
3030
});
31-
test("You should add your rules below the existing code", ()=>{
32-
document.querySelector(
33-
"head"
34-
).innerHTML = `<style>${css.toString()}</style>`;
35-
let cssArray = document.styleSheets[0].cssRules[0].selectorText;
36-
37-
expect(cssArray).toBe("#my-first-div");
38-
}
39-
)
40-
test("You should add your rules below the existing code", ()=>{
41-
document.querySelector(
42-
"head"
43-
).innerHTML = `<style>${css.toString()}</style>`;
44-
let cssArray = document.styleSheets[0].cssRules[1].selectorText;
45-
expect(cssArray).toBe("#the-second-one");
46-
}
47-
)
4831
test("You should not change the existing head tag elements", ()=>{
4932
let head = document.querySelector('head')
5033
expect(head).toBeTruthy()

‎exercises/13-Anchor-Like-Button/tests.js

Lines changed: 0 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -29,15 +29,6 @@ describe("All the styles should be applied", ()=>{
2929
let classTagStyles = window.getComputedStyle(divTag);
3030
expect(classTagStyles["border-radius"]).toBe("4px");
3131
});
32-
test("the background should be 'orange'", ()=>{
33-
document.querySelector(
34-
"head"
35-
36-
).innerHTML = `<style>${css.toString()}</style>`;
37-
let divTag = document.querySelector(".orange-btn");
38-
let classTagStyles = window.getComputedStyle(divTag);
39-
expect(classTagStyles["background"]).toBe("orange");
40-
});
4132
test("the underline should be removed", ()=>{
4233
document.querySelector(
4334
"head"
@@ -47,22 +38,6 @@ describe("All the styles should be applied", ()=>{
4738
let classTagStyles = window.getComputedStyle(divTag);
4839
expect(classTagStyles["text-decoration"]).toBe("none");
4940
});
50-
test("The mouse hover property should be 'darkorange'", ()=>{
51-
// get computed styles of any element you like
52-
document.querySelector(
53-
"head"
54-
).innerHTML = `<style>${css.toString()}</style>`;
55-
let cssArray = document.styleSheets[0].cssRules;
56-
57-
let orangeHoverSelector = "";
58-
for (let i = 0; i < cssArray.length; i++) {
59-
if (cssArray[i].selectorText === ".orange-btn:hover") {
60-
orangeHoverSelector = cssArray[i].style.background;
61-
}
62-
}
63-
64-
expect(orangeHoverSelector).toBe("darkorange");
65-
});
6641

6742
test("You should be careful with the specificity", ()=>{
6843
document.querySelector(

0 commit comments

Comments
 (0)