Make small fixes to part5d

Author: vejol

src/content/5/en/part5d.md

@@ -912,6 +912,9 @@ export { loginWith, createNote } // highlight-line
 The tests are simplified as follows:
 
 ```js
+const { test, describe, expect, beforeEach } = require('@playwright/test')
+const { createNote, loginWith } = require('./helper') // highlight-line
+
 describe('Note app', () => {
   // ...
 
@@ -995,7 +998,7 @@ Let's change the initialization block of the test so that it creates two notes i
 ```js
 describe('when logged in', () => {
   // ...
-  describe('and several notes exists', () => {
+  describe('and several notes exists', () => { // highlight-line
     beforeEach(async ({ page }) => {
       // highlight-start
       await createNote(page, 'first note')
@@ -1051,7 +1054,7 @@ One way to fix the problem is as follows:
 ```js
 test('one of those can be made nonimportant', async ({ page }) => {
   const otherNoteText = page.getByText('first note') // highlight-line
-  const otherNoteElement = await otherNoteText.locator('..') // highlight-line
+  const otherNoteElement = otherNoteText.locator('..') // highlight-line
 
   await otherNoteElement.getByRole('button', { name: 'make not important' }).click()
   await expect(otherNoteElement.getByText('make important')).toBeVisible()
@@ -1083,16 +1086,16 @@ describe('when logged in', () => {
     await expect(page.getByText('a note created by playwright')).toBeVisible()
   })
 
-  describe('and a note exists', () => {
+  describe('and several notes exists', () => {
     beforeEach(async ({ page }) => {
       await createNote(page, 'first note')
       await createNote(page, 'second note')
       await createNote(page, 'third note') // highlight-line
     })
 
-    test('importance can be changed', async ({ page }) => {
+    test('one of those can be made nonimportant', async ({ page }) => {
       const otherNoteText = page.getByText('second note') // highlight-line
-      const otherNoteElement = await otherNoteText.locator('..')
+      const otherNoteElement = otherNoteText.locator('..')
 
       await otherNoteElement.getByRole('button', { name: 'make not important' }).click()
       await expect(otherNoteElement.getByText('make important')).toBeVisible()
@@ -1110,7 +1113,7 @@ If, and when the tests don't pass and you suspect that the fault is in the tests
 The following command runs the problematic test in debug mode:
 
 ```
-npm test -- -g'importance can be changed' --debug
+npm test -- -g'one of those can be made nonimportant' --debug
 ```
 
 Playwright-inspector shows the progress of the tests step by step. The arrow-dot button at the top takes the tests one step further. The elements found by the locators and the interaction with the browser are visualized in the browser:
@@ -1140,7 +1143,7 @@ describe('Note app', () => {
       test('one of those can be made nonimportant', async ({ page }) => {
         await page.pause() // highlight-line
         const otherNoteText = page.getByText('second note')
-        const otherNoteElement = await otherNoteText.locator('..')
+        const otherNoteElement = otherNoteText.locator('..')
 
         await otherNoteElement.getByRole('button', { name: 'make not important' }).click()
         await expect(otherNoteElement.getByText('make important')).toBeVisible()

src/content/5/fi/osa5d.md

@@ -867,9 +867,12 @@ const createNote = async (page, content) => {
 export { loginWith, createNote } // highlight-line
 ```
 
-Testi yksinkertaistuu seuraavasti:
+Testit yksinkertaistuvat seuraavasti:
 
 ```js
+const { test, describe, expect, beforeEach } = require('@playwright/test')
+const { createNote, loginWith } = require('./helper') // highlight-line
+
 describe('Note app', () => {
   // ...
 
@@ -879,13 +882,13 @@ describe('Note app', () => {
     })
 
     test('a new note can be created', async ({ page }) => {
-      await createNote(page, 'a note created by playwright')
+      await createNote(page, 'a note created by playwright') // highlight-line
       await expect(page.getByText('a note created by playwright')).toBeVisible()
     })
 
     describe('and a note exists', () => {
       beforeEach(async ({ page }) => {
-        await createNote(page, 'another note by playwright')
+        await createNote(page, 'another note by playwright') // highlight-line
       })
 
       test('importance can be changed', async ({ page }) => {
@@ -953,7 +956,7 @@ Muutetaan testin alustuslohkoa siten, että se luo yhden sijaan kaksi muistiinpa
 ```js
 describe('when logged in', () => {
   // ...
-  describe('and several notes exists', () => {
+  describe('and several notes exists', () => { // highlight-line
     beforeEach(async ({ page }) => {
       // highlight-start
       await createNote(page, 'first note', true)
@@ -1009,10 +1012,10 @@ Eräs tapa korjata ongelma on seuraavassa:
 ```js
 test('one of those can be made nonimportant', async ({ page }) => {
   const otherNoteText = page.getByText('first note') // highlight-line
-  const otherdNoteElement = await otherNoteText.locator('..') // highlight-line
+  const otherNoteElement = otherNoteText.locator('..') // highlight-line
 
-  await otherdNoteElement.getByRole('button', { name: 'make not important' }).click()
-  await expect(otherdNoteElement.getByText('make important')).toBeVisible()
+  await otherNoteElement.getByRole('button', { name: 'make not important' }).click()
+  await expect(otherNoteElement.getByText('make important')).toBeVisible()
 })
 ```
 
@@ -1041,19 +1044,19 @@ describe('when logged in', () => {
     await expect(page.getByText('a note created by playwright')).toBeVisible()
   })
 
-  describe('and a note exists', () => {
+  describe('and several notes exists', () => {
     beforeEach(async ({ page }) => {
       await createNote(page, 'first note', true)
       await createNote(page, 'second note', true)
       await createNote(page, 'third note', true) // highlight-line
     })
 
-    test('importance can be changed', async ({ page }) => {
+    test('one of those can be made nonimportant', async ({ page }) => {
       const otherNoteText = page.getByText('second note') // highlight-line
-      const otherdNoteElement = await otherNoteText.locator('..')
+      const otherNoteElement = otherNoteText.locator('..')
 
-      await otherdNoteElement.getByRole('button', { name: 'make not important' }).click()
-      await expect(otherdNoteElement.getByText('make important')).toBeVisible()
+      await otherNoteElement.getByRole('button', { name: 'make not important' }).click()
+      await expect(otherNoteElement.getByText('make important')).toBeVisible()
     })
   })
 }) 
@@ -1068,7 +1071,7 @@ Jos/kun testit eivät mene läpi ja herää epäilys, että vika on koodin sijaa
 Seuraava komento suorittaa ongelmallisen testin debug-moodissa:
 
 ```
-npm test -- -g'importance can be changed' --debug
+npm test -- -g'one of those can be made nonimportant' --debug
 ```
 
 Playwright-inspector näyttää testien etenemisen askel askeleelta. Yläreunan nuoli-piste-painike vie testejä yhden askeleen eteenpäin. Lokaattorien löytämät elementit sekä selaimen kanssa käyty interaktio visualisoituvat selaimeen:
@@ -1098,10 +1101,10 @@ describe('Note app', () => {
       test('one of those can be made unimportant', async ({ page }) => {
         await page.pause() // highlight-line
         const otherNoteText = page.getByText('second note')
-        const otherdNoteElement = await otherNoteText.locator('..')
+        const otherNoteElement = otherNoteText.locator('..')
 
-        await otherdNoteElement.getByRole('button', { name: 'make not important' }).click()
-        await expect(otherdNoteElement.getByText('make important')).toBeVisible()
+        await otherNoteElement.getByRole('button', { name: 'make not important' }).click()
+        await expect(otherNoteElement.getByText('make important')).toBeVisible()
       })
     })
   })