fix(curriculum) allow space, update wording, include position prop in hints (#55832)

This commit is contained in:
Lasse Jørgensen
2024-08-15 20:10:33 +02:00
committed by GitHub
parent 59a2eac925
commit 97045bf975

View File

@@ -9,7 +9,7 @@ dashedName: step-98
Now you need to create a `draw` method for the `CheckPoint` class.
Inside the `draw` method, add a `fillStyle` property to the `ctx` object and set it to `"#f1be32"`.
Inside the `draw` method, assign the `fillStyle` property on the `ctx` object the hex color `"#f1be32"`.
Below the `fillStyle` property, use the `fillRect` method on the `ctx` object and pass in the `x`, `y`, `width`, and `height` properties as arguments.
@@ -18,35 +18,35 @@ Below the `fillStyle` property, use the `fillRect` method on the `ctx` object an
Your `CheckPoint` class should have a `draw` method.
```js
const splitter = code.split("ctx.fillRect(this.position.x, this.position.y, this.width, this.height)")
assert.match(splitter[2], /draw\(\s*\)\s*\{/);
const splitter = code.split("ctx.fillRect(this.position.x, this.position.y, this.width, this.height)");
assert.match(splitter[2], /draw\s*\(\s*\)\s*\{/);
```
Your `draw` method should have a `fillStyle` property added to the `ctx` object.
Your `draw` method should assign a value to the `fillStyle` property on the `ctx` object.
```js
const splitter = code.split("ctx.fillRect(this.position.x, this.position.y, this.width, this.height)")
assert.match(splitter[2], /draw\(\s*\)\s*\{\s*ctx\.fillStyle/);
const splitter = code.split("ctx.fillRect(this.position.x, this.position.y, this.width, this.height)");
assert.match(splitter[2], /draw\s*\(\s*\)\s*\{\s*ctx\.fillStyle\s*=/);
```
You should assign `"#f1be32"` to the `ctx.fillStyle` property.
You should assign the hex color `"#f1be32"` to the `fillStyle` property on the `ctx` object.
```js
const splitter = code.split("ctx.fillRect(this.position.x, this.position.y, this.width, this.height)")
assert.match(splitter[2], /draw\(\s*\)\s*\{\s*ctx\.fillStyle\s*=\s*('|")#f1be32\1\s*;?/);
const splitter = code.split("ctx.fillRect(this.position.x, this.position.y, this.width, this.height)");
assert.match(splitter[2], /draw\s*\(\s*\)\s*\{\s*ctx\.fillStyle\s*=\s*('|")#f1be32\1\s*;?/);
```
Your `draw` method should invoke the `fillRect` method on the `ctx` object.
```js
const splitter = code.split('#f1be32')
const splitter = code.split('#f1be32');
assert.match(splitter[1], /ctx\.fillRect\(/);
```
When invoking `ctx.fillRect` you should pass in the `x`, `y`, `width`, and `height` properties as arguments. Don't forget the `this` keyword.
When invoking `ctx.fillRect` you should pass in the `position.x`, `position.y`, `width`, and `height` properties as arguments. Don't forget the `this` keyword.
```js
const splitter = code.split('#f1be32')
const splitter = code.split('#f1be32');
assert.match(splitter[1], /ctx\.fillRect\(\s*this\.position\.x\s*,\s*this\.position\.y\s*,\s*this\.width\s*,\s*this\.height\s*\)\s*;?/);
```