CodeCow/freeCodeCamp
1
0
Fork 0
mirror of https://github.com/freeCodeCamp/freeCodeCamp.git synced 2026-06-22 21:08:12 +08:00
Code Issues Actions 5 Packages Projects Releases Wiki Activity

chore(curriculum): add quotes to text / strings in Build a Pokémon Search App Project (#53939)

Browse Source
This commit is contained in:
RGHANILOO 2024-03-02 00:15:07 +00:00 committed by GitHub
parent da536be451
commit e9f832d3bd
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 31 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

62
curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/build-a-pokemon-search-app-project/build-a-pokemon-search-app.md
View File

@ -14,22 +14,22 @@ In this project, you'll build an app that will search for Pokémon by name or ID
**User Stories:**
1. You should have an `input` element with an `id` of `search-input`
1. You should have a `button` element with an `id` of `search-button`
1. You should have an element with an `id` of `pokemon-name`
1. You should have an element with an `id` of `pokemon-id`
1. You should have an element with an `id` of `weight`
1. You should have an element with an `id` of `height`
1. You should have an element with an `id` of `types`
1. You should have an element with an `id` of `hp`
1. You should have an element with an `id` of `attack`
1. You should have an element with an `id` of `defense`
1. You should have an element with an `id` of `special-attack`
1. You should have an element with an `id` of `special-defense`
1. You should have an element with an `id` of `speed`
1. When the `#search-input` element contains the value `Red` and the `#search-button` element is clicked, an alert should appear with the text `Pokémon not found`
1. You should have an `input` element with an `id` of `"search-input"`
1. You should have a `button` element with an `id` of `"search-button`
1. You should have an element with an `id` of `"pokemon-name"`
1. You should have an element with an `id` of `"pokemon-id"`
1. You should have an element with an `id` of `"weight"`
1. You should have an element with an `id` of `"height"`
1. You should have an element with an `id` of `"types"`
1. You should have an element with an `id` of `"hp"`
1. You should have an element with an `id` of `"attack"`
1. You should have an element with an `id` of `"defense"`
1. You should have an element with an `id` of `"special-attack"`
1. You should have an element with an `id` of `"special-defense"`
1. You should have an element with an `id` of `"speed"`
1. When the `#search-input` element contains the value `Red` and the `#search-button` element is clicked, an alert should appear with the text `"Pokémon not found"`
1. When the `#search-input` element contains the value `Pikachu` and the `#search-button` element is clicked, the values in the `#pokemon-name`, `#pokemon-id`, `#weight`, `#height`, `#hp`, `#attack`, `#defense`, `#special-attack`, `#special-defense`, and `#speed` elements should be `PIKACHU`, `#25` or `25`, `Weight: 60` or `60`, `Height: 4` or `4`, `35`, `55`, `40`, `50`, `50`, and `90`, respectively
1. When the `#search-input` element contains the value `Pikachu` and the `#search-button` element is clicked, you should add an `img` element with the `id` of `sprite` and the `src` set to the Pokémon's `front_default` sprite to the page
1. When the `#search-input` element contains the value `Pikachu` and the `#search-button` element is clicked, you should add an `img` element with the `id` of `"sprite"` and the `src` set to the Pokémon's `front_default` sprite to the page
1. When the `#search-input` element contains the value `Pikachu` and the `#search-button` element is clicked, the `#types` element should contain a single inner element with the value `ELECTRIC`. The `#types` element content should be cleared between searches
1. When the `#search-input` element contains the value `94` and the `#search-button` element is clicked, the values in the `#pokemon-name`, `#pokemon-id`, `#weight`, `#height`, `#hp`, `#attack`, `#defense`, `#special-attack`, `#special-defense`, and `#speed`elements should be `GENGAR`, `#94` or `94`, `Weight: 405` or `405`, `Height: 15` or `15`, `60`, `65`, `60`, `130`, `75`, and `110`, respectively
1. When the `#search-input` element contains the value `94` and the `#search-button` element is clicked, you should add an `img` element with the `id` of `sprite` and the `src` set to the Pokémon's `front_default` sprite to the page
@ -41,7 +41,7 @@ Fulfill the user stories and pass all the tests below to complete this project.
# --hints--
You should have an `input` element with an `id` of `search-input` and is **required**.
You should have an `input` element with an `id` of `"search-input"` and is **required**.
```js
const el = document.getElementById('search-input');
@ -49,91 +49,91 @@ assert.strictEqual(el?.nodeName?.toLowerCase(), 'input');
assert.isTrue(el?.required);
```
You should have a `button` element with an `id` of `search-button`.
You should have a `button` element with an `id` of `"search-button"`.
```js
const el = document.getElementById('search-button');
assert.strictEqual(el?.nodeName?.toLowerCase(), 'button');
```
You should have an element with an `id` of `pokemon-name`.
You should have an element with an `id` of `"pokemon-name"`.
```js
const el = document.getElementById('pokemon-name');
assert.exists(el);
```
You should have an element with an `id` of `pokemon-id`.
You should have an element with an `id` of `"pokemon-id"`.
```js
const el = document.getElementById('pokemon-id');
assert.exists(el);
```
You should have an element with an `id` of `weight`.
You should have an element with an `id` of `"weight"`.
```js
const el = document.getElementById('weight');
assert.exists(el);
```
You should have an element with an `id` of `height`.
You should have an element with an `id` of `"height"`.
```js
const el = document.getElementById('height');
assert.exists(el);
```
You should have an element with an `id` of `types`.
You should have an element with an `id` of `"types"`.
```js
const el = document.getElementById('types');
assert.exists(el);
```
You should have an element with an `id` of `hp`.
You should have an element with an `id` of `"hp"`.
```js
const el = document.getElementById('hp');
assert.exists(el);
```
You should have an element with an `id` of `attack`.
You should have an element with an `id` of `"attack"`.
```js
const el = document.getElementById('attack');
assert.exists(el);
```
You should have an element with an `id` of `defense`.
You should have an element with an `id` of `"defense"`.
```js
const el = document.getElementById('defense');
assert.exists(el);
```
You should have an element with an `id` of `special-attack`.
You should have an element with an `id` of `"special-attack"`.
```js
const el = document.getElementById('special-attack');
assert.exists(el);
```
You should have an element with an `id` of `special-defense`.
You should have an element with an `id` of `"special-defense"`.
```js
const el = document.getElementById('special-defense');
assert.exists(el);
```
You should have an element with an `id` of `speed`.
You should have an element with an `id` of `"speed"`.
```js
const el = document.getElementById('speed');
assert.exists(el);
```
When the `#search-input` element contains the value `Red` and the `#search-button` element is clicked, an alert should appear with the text `Pokémon not found`.
When the `#search-input` element contains the value `Red` and the `#search-button` element is clicked, an alert should appear with the text `"Pokémon not found"`.
```js
async () => {
@ -201,7 +201,7 @@ async () => {
};
```
When the `#search-input` element contains the value `Pikachu` and the `#search-button` element is clicked, you should add an `img` element with the `id` of `sprite` and the `src` set to the Pokémon's `front_default` sprite to the page.
When the `#search-input` element contains the value `Pikachu` and the `#search-button` element is clicked, you should add an `img` element with the `id` of `"sprite"` and the `src` set to the Pokémon's `front_default` sprite to the page.
```js
async () => {
@ -294,7 +294,7 @@ async () => {
};
```
When the `#search-input` element contains the value `94` and the `#search-button` element is clicked, you should add an `img` element with the `id` of `sprite` and the `src` set to the Pokémon's `front_default` sprite to the page.
When the `#search-input` element contains the value `94` and the `#search-button` element is clicked, you should add an `img` element with the `id` of `"sprite"` and the `src` set to the Pokémon's `front_default` sprite to the page.
```js
async () => {