jprdonnelly/freeCodeCamp
1
0
Fork 0
mirror of https://github.com/freeCodeCamp/freeCodeCamp.git synced 2026-05-07 06:02:06 -04:00
Code Issues Projects Releases Wiki Activity

fix(curriculum): rename get-weather button id to get-weather-btn (#61106)

Browse Source
This commit is contained in:
MISHRA ANUBHAV
2025-06-27 22:57:50 +05:30
committed by GitHub
parent 97c4f45dd5
commit 9d0b78496c
1 changed files with 20 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
curriculum/challenges/english/25-front-end-development/lab-weather-app/66f12a88741aeb16b9246c59.md
View File

@@ -41,7 +41,7 @@ You will use a weather API. The output data has the following format:
**User Stories:**
1. You should have a `button` element with an `id` of `get-weather`.
1. You should have a `button` element with an `id` of `get-weather-btn`.
1. You should have a `select` element with seven `option` elements nested within it. The first option should have an empty string as its text and `value` attribute. The rest should have the following for their text and values (with the value being lowercase):
@@ -303,10 +303,10 @@ const helper = (wobj) => ({
# --hints--
You should have a `button` element with an `id` of `get-weather`.
You should have a `button` element with an `id` of `get-weather-btn`.
```js
assert.exists(document.querySelector('button#get-weather'));
assert.exists(document.querySelector('button#get-weather-btn'));
```
You should have a `select` element.
@@ -344,7 +344,7 @@ You should have an `img` element with the id `weather-icon` for displaying the w
```js
async () => {
document.querySelector('select').value = 'chicago';
document.querySelector('#get-weather').click();
document.querySelector('#get-weather-btn').click();
await new Promise(resolve => setTimeout(resolve, 1));
assert.exists(document.querySelector('img#weather-icon'));
};
@@ -355,7 +355,7 @@ You should have an element with the id `main-temperature` for displaying the mai
```js
async () => {
document.querySelector('select').value = 'london';
document.querySelector('#get-weather').click();
document.querySelector('#get-weather-btn').click();
await new Promise(resolve => setTimeout(resolve, 1));
assert.exists(document.querySelector('#main-temperature'));
};
@@ -366,7 +366,7 @@ You should have an element with the id `feels-like` for displaying what the temp
```js
async () => {
document.querySelector('select').value = 'london';
document.querySelector('#get-weather').click();
document.querySelector('#get-weather-btn').click();
await new Promise(resolve => setTimeout(resolve, 1));
assert.exists(document.querySelector('#feels-like'));
};
@@ -377,7 +377,7 @@ You should have an element with the id `humidity` for displaying the amount of h
```js
async () => {
document.querySelector('select').value = 'london';
document.querySelector('#get-weather').click();
document.querySelector('#get-weather-btn').click();
await new Promise(resolve => setTimeout(resolve, 1));
assert.exists(document.querySelector('#humidity'));
};
@@ -388,7 +388,7 @@ You should have an element with the id `wind` for displaying the wind speed.
```js
async () => {
document.querySelector('select').value = 'new york';
document.querySelector('#get-weather').click();
document.querySelector('#get-weather-btn').click();
await new Promise(resolve => setTimeout(resolve, 1));
assert.exists(document.querySelector('#wind'));
};
@@ -399,7 +399,7 @@ You should have an element with the id `wind-gust` for displaying the wind gust.
```js
async () => {
document.querySelector('select').value = 'new york';
document.querySelector('#get-weather').click();
document.querySelector('#get-weather-btn').click();
await new Promise(resolve => setTimeout(resolve, 1));
assert.exists(document.querySelector('#wind-gust'));
};
@@ -410,7 +410,7 @@ You should have an element with the id `weather-main` for displaying the main we
```js
async () => {
document.querySelector('select').value = 'new york';
document.querySelector('#get-weather').click();
document.querySelector('#get-weather-btn').click();
await new Promise(resolve => setTimeout(resolve, 1));
assert.exists(document.querySelector('#weather-main'));
};
@@ -421,7 +421,7 @@ You should have an element with the id `location` for displaying the current loc
```js
async () => {
document.querySelector('select').value = 'new york';
document.querySelector('#get-weather').click();
document.querySelector('#get-weather-btn').click();
await new Promise(resolve => setTimeout(resolve, 1));
assert.exists(document.querySelector('#location'));
};
@@ -504,7 +504,7 @@ async () => {
try {
const city = 'new york';
document.querySelector('select').value = city;
document.querySelector('#get-weather').click();
document.querySelector('#get-weather-btn').click();
// fetch the expected values from the API to confront
const body = await fetch(
@@ -541,7 +541,7 @@ async () => {
try {
const city = 'chicago';
document.querySelector('select').value = city;
document.querySelector('#get-weather').click();
document.querySelector('#get-weather-btn').click();
// fetch the expected values from the API to confront
const body = await fetch(
@@ -578,7 +578,7 @@ async () => {
try {
const city = 'london';
document.querySelector('select').value = city;
document.querySelector('#get-weather').click();
document.querySelector('#get-weather-btn').click();
// fetch the expected values from the API to confront
const body = await fetch(
@@ -615,7 +615,7 @@ async () => {
try {
const city = 'tokyo';
document.querySelector('select').value = city;
document.querySelector('#get-weather').click();
document.querySelector('#get-weather-btn').click();
// fetch the expected values from the API to confront
const body = await fetch(
@@ -652,7 +652,7 @@ async () => {
try {
const city = 'los angeles';
document.querySelector('select').value = city;
document.querySelector('#get-weather').click();
document.querySelector('#get-weather-btn').click();
// fetch the expected values from the API to confront
const body = await fetch(
@@ -726,7 +726,7 @@ async () => {
};
const city = 'paris';
document.querySelector('select').value = city;
document.querySelector('#get-weather').click();
document.querySelector('#get-weather-btn').click();
await new Promise(resolve => setTimeout(resolve, 1));
assert.include(testArr[0], 'Something went wrong, please try again later');
assert.lengthOf(testArr, 1);
@@ -818,7 +818,7 @@ async () => {
<option value="tokyo">Tokyo</option>
<option value="london">London</option>
</select>
<button id="get-weather">Get Weather</button>
<button id="get-weather-btn">Get Weather</button>
</div>
<script type="text/javascript" src="script.js"></script>
@@ -878,7 +878,7 @@ body {
font-size: 1.25em;
}
#get-weather {
#get-weather-btn {
font-size: 1.25em;
height: 50px;
width: 200px;
@@ -1024,7 +1024,7 @@ body {
```
```js
const getWeatherBtn = document.getElementById('get-weather');
const getWeatherBtn = document.getElementById('get-weather-btn');
const selectEl = document.getElementById('location-selector');
const weatherInfoEl = document.getElementById('weather-info');