Skip to content

Commit

Permalink
test(e2e): add more test cases for hmr
Browse files Browse the repository at this point in the history
  • Loading branch information
@meteorlxy
meteorlxy committed Sep 10, 2024
1 parent 0fe831f commit 7dcdadc
Show file tree
Hide file tree
Showing 4 changed files with 91 additions and 17 deletions.
11 changes: 11 additions & 0 deletions e2e/docs/hmr/content.md
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
## link to frontmatter

[frontmatter](./frontmatter.md)

## link to title

[title](./title.md)

## content

HMR content
4 changes: 4 additions & 0 deletions e2e/docs/hmr/frontmatter.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,10 @@
foo: HMR foo
---

## link to content

[content](./content.md)

## link to title

[title](./title.md)
Expand Down
4 changes: 4 additions & 0 deletions e2e/docs/hmr/title.md
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,9 @@
# HMR Title

## link to content

[content](./content.md)

## link to frontmatter

[frontmatter](./frontmatter.md)
Expand Down
89 changes: 72 additions & 17 deletions e2e/tests/hmr.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,11 @@ import { expect, test } from '@playwright/test'
import { IS_DEV } from '../utils/env'
import { readSourceMarkdown, writeSourceMarkdown } from '../utils/source'

const hmrUpdateTitle = async (): Promise<void> => {
const markdownContent = await readSourceMarkdown('hmr/title.md')
const hmrUpdateContent = async (): Promise<void> => {
const markdownContent = await readSourceMarkdown('hmr/content.md')
await writeSourceMarkdown(
'hmr/title.md',
markdownContent.replace('# HMR Title', '# Updated Title'),
'hmr/content.md',
markdownContent.replace('HMR content', 'Updated content'),
)
}

Expand All @@ -18,19 +18,32 @@ const hmrUpdateFrontmatter = async (): Promise<void> => {
)
}

const hmrUpdateTitle = async (): Promise<void> => {
const markdownContent = await readSourceMarkdown('hmr/title.md')
await writeSourceMarkdown(
'hmr/title.md',
markdownContent.replace('# HMR Title', '# Updated Title'),
)
}

const hmrRestore = async (): Promise<void> => {
const titleMarkdownContent = await readSourceMarkdown('hmr/title.md')
const contentMarkdownContent = await readSourceMarkdown('hmr/content.md')
const frontmatterMarkdownContent =
await readSourceMarkdown('hmr/frontmatter.md')
const titleMarkdownContent = await readSourceMarkdown('hmr/title.md')

await writeSourceMarkdown(
'hmr/title.md',
titleMarkdownContent.replace('# Updated Title', '# HMR Title'),
'hmr/content.md',
contentMarkdownContent.replace('Updated content', 'HMR content'),
)
await writeSourceMarkdown(
'hmr/frontmatter.md',
frontmatterMarkdownContent.replace('foo: Updated foo', 'foo: HMR foo'),
)
await writeSourceMarkdown(
'hmr/title.md',
titleMarkdownContent.replace('# Updated Title', '# HMR Title'),
)
}

if (IS_DEV) {
Expand All @@ -41,6 +54,16 @@ if (IS_DEV) {
await hmrRestore()
})

test('should update content correctly', async ({ page }) => {
const contentLocator = page.locator('.e2e-theme-content #content + p')

await page.goto('hmr/content.html')

await expect(contentLocator).toHaveText('HMR content')
await hmrUpdateContent()
await expect(contentLocator).toHaveText('Updated content')
})

test('should update frontmatter correctly', async ({ page }) => {
const frontmatterLocator = page.locator(
'.e2e-theme-content #rendered-foo + p',
Expand All @@ -54,53 +77,85 @@ if (IS_DEV) {
})

test('should update title correctly', async ({ page }) => {
const titleLocator = page.locator('.e2e-theme-content #rendered-title + p')
const titleLocator = page.locator('.e2e-theme-content h1')
const renderedTitleLocator = page.locator(
'.e2e-theme-content #rendered-title + p',
)

await page.goto('hmr/title.html')

await expect(page).toHaveTitle(/HMR Title/)
await expect(titleLocator).toHaveText('HMR Title')
await expect(renderedTitleLocator).toHaveText('HMR Title')
await hmrUpdateTitle()
await expect(page).toHaveTitle(/Updated Title/)
await expect(titleLocator).toHaveText('Updated Title')
await expect(renderedTitleLocator).toHaveText('Updated Title')
})

test('should update title and frontmatter correctly after navigation', async ({
test('should update content and frontmatter and title correctly after navigation', async ({
page,
}) => {
const titleLocator = page.locator('.e2e-theme-content #rendered-title + p')
// text locators
const contentLocator = page.locator('.e2e-theme-content #content + p')
const frontmatterLocator = page.locator(
'.e2e-theme-content #rendered-foo + p',
)
const titleLocator = page.locator('.e2e-theme-content #rendered-title + p')
const renderedTitleLocator = page.locator(
'.e2e-theme-content #rendered-title + p',
)

// link locators
const contentPageLinkLocator = page.locator(
'.e2e-theme-content #link-to-content + p > a',
)
const frontmatterPageLinkLocator = page.locator(
'.e2e-theme-content #link-to-frontmatter + p > a',
)
const titlePageLinkLocator = page.locator(
'.e2e-theme-content #link-to-title + p > a',
)

// start from title page
await page.goto('hmr/title.html')
await expect(page).toHaveTitle(/HMR Title/)

Check failure on line 122 in e2e/tests/hmr.spec.ts

View workflow job for this annotation

GitHub Actions / e2e (macos-latest, 22, vite)

[chromium] › hmr.spec.ts:96:3 › should update content and frontmatter and title correctly after navigation 

  1) [chromium] › hmr.spec.ts:96:3 › should update content and frontmatter and title correctly after navigation 
    Error: Timed out 5000ms waiting for expect(locator).toHaveTitle(expected)

    Locator: locator(':root')
    Expected pattern: /HMR Title/
    Received string:  "Updated Title | VuePress E2E"
    Call log:
      - expect.toHaveTitle with timeout 5000ms
      - waiting for locator(':root')
      -   locator resolved to <html lang="en">…</html>
      -   unexpected value ""
      -   locator resolved to <html lang="en">…</html>
      -   unexpected value ""
      -   locator resolved to <html lang="en-US">…</html>
      -   unexpected value "Updated Title | VuePress E2E"
      -   locator resolved to <html lang="en-US">…</html>
      -   unexpected value "Updated Title | VuePress E2E"
      -   locator resolved to <html lang="en-US">…</html>
      -   unexpected value "Updated Title | VuePress E2E"
      -   locator resolved to <html lang="en-US">…</html>
      -   unexpected value "Updated Title | VuePress E2E"
      -   locator resolved to <html lang="en-US">…</html>
      -   unexpected value "Updated Title | VuePress E2E"
      -   locator resolved to <html lang="en-US">…</html>
      -   unexpected value "Updated Title | VuePress E2E"
      -   locator resolved to <html lang="en-US">…</html>
      -   unexpected value "Updated Title | VuePress E2E"


      120 |     // start from title page
      121 |     await page.goto('hmr/title.html')
    > 122 |     await expect(page).toHaveTitle(/HMR Title/)
          |                        ^
      123 |     await expect(titleLocator).toHaveText('HMR Title')
      124 |     await expect(renderedTitleLocator).toHaveText('HMR Title')
      125 |

        at /Users/runner/work/core/core/e2e/tests/hmr.spec.ts:122:24
await expect(titleLocator).toHaveText('HMR Title')
await expect(renderedTitleLocator).toHaveText('HMR Title')

// update title page
await hmrUpdateTitle()
await expect(page).toHaveTitle(/Updated Title/)
await expect(titleLocator).toHaveText('Updated Title')
await expect(renderedTitleLocator).toHaveText('Updated Title')

// navigate to frontmatter page
await page
.locator('.e2e-theme-content #link-to-frontmatter + p > a')
.click()
await frontmatterPageLinkLocator.click()
await expect(frontmatterLocator).toHaveText('HMR foo')

// update frontmatter page
await hmrUpdateFrontmatter()
await expect(frontmatterLocator).toHaveText('Updated foo')

Check failure on line 138 in e2e/tests/hmr.spec.ts

View workflow job for this annotation

GitHub Actions / e2e (ubuntu-latest, 18, webpack)

[chromium] › hmr.spec.ts:96:3 › should update content and frontmatter and title correctly after navigation 

  1) [chromium] › hmr.spec.ts:96:3 › should update content and frontmatter and title correctly after navigation 
    Error: Timed out 5000ms waiting for expect(locator).toHaveText(expected)

    Locator: locator('.e2e-theme-content #rendered-foo + p')
    Expected string: "Updated foo"
    Received: <element(s) not found>
    Call log:
      - expect.toHaveText with timeout 5000ms
      - waiting for locator('.e2e-theme-content #rendered-foo + p')
      -   locator resolved to <p>HMR foo</p>
      -   unexpected value "HMR foo"
      -   locator resolved to <p>HMR foo</p>
      -   unexpected value "HMR foo"


      136 |     // update frontmatter page
      137 |     await hmrUpdateFrontmatter()
    > 138 |     await expect(frontmatterLocator).toHaveText('Updated foo')
          |                                      ^
      139 |
      140 |     // navigate to content page
      141 |     await contentPageLinkLocator.click()

        at /home/runner/work/core/core/e2e/tests/hmr.spec.ts:138:38

// navigate to content page
await contentPageLinkLocator.click()
await expect(contentLocator).toHaveText('HMR content')

// update content page
await hmrUpdateContent()
await expect(contentLocator).toHaveText('Updated content')

// navigate to back title page
await page.locator('.e2e-theme-content #link-to-title + p > a').click()
await titlePageLinkLocator.click()
await expect(page).toHaveTitle(/Updated Title/)
await expect(titleLocator).toHaveText('Updated Title')

// navigate to back frontmatter page
await page
.locator('.e2e-theme-content #link-to-frontmatter + p > a')
.click()
await frontmatterPageLinkLocator.click()
await expect(frontmatterLocator).toHaveText('Updated foo')

// navigate to back content page
await contentPageLinkLocator.click()
await expect(contentLocator).toHaveText('Updated content')
})
}

0 comments on commit 7dcdadc

Please sign in to comment.