Migrate tests/ files to src/ (#45840)
This commit is contained in:
Kevin Heis
581
src/fixtures/tests/playwright-rendering.spec.ts
Normal file
581
src/fixtures/tests/playwright-rendering.spec.ts
Normal file
@@ -0,0 +1,581 @@
|
||||
import dotenv from 'dotenv'
|
||||
import { test, expect } from '@playwright/test'
|
||||
|
||||
// This exists for the benefit of local testing.
|
||||
// In GitHub Actions, we rely on setting the environment variable directly
|
||||
// but for convenience, for local development, engineers might have a
|
||||
// .env file that can set environment variable. E.g. ELASTICSEARCH_URL.
|
||||
// The `src/frame/start-server.js` script uses dotenv too, but since Playwright
|
||||
// tests only interface with the server via HTTP, we too need to find
|
||||
// this out.
|
||||
dotenv.config()
|
||||
|
||||
const SEARCH_TESTS = !!process.env.ELASTICSEARCH_URL
|
||||
|
||||
test('view home page', async ({ page }) => {
|
||||
await page.goto('/')
|
||||
await expect(page).toHaveTitle(/GitHub Docs/)
|
||||
})
|
||||
|
||||
test('logo link keeps current version', async ({ page }) => {
|
||||
await page.goto('/enterprise-cloud@latest')
|
||||
// Basically clicking into any page that isn't the home page for this version.
|
||||
await page.getByTestId('product').getByRole('link', { name: 'Get started' }).click()
|
||||
await expect(page).toHaveURL(/\/en\/enterprise-cloud@latest\/get-started/)
|
||||
await page.getByRole('link', { name: 'GitHub Docs' }).click()
|
||||
await expect(page).toHaveURL(/\/en\/enterprise-cloud@latest/)
|
||||
})
|
||||
|
||||
test('view the for-playwright article', async ({ page }) => {
|
||||
await page.goto('/get-started/foo/for-playwright')
|
||||
await expect(page).toHaveTitle(/For Playwright - GitHub Docs/)
|
||||
|
||||
// This is the right-hand sidebar mini-toc link
|
||||
await page
|
||||
.getByTestId('minitoc')
|
||||
.getByRole('link', { name: 'Second heading', exact: true })
|
||||
.click()
|
||||
await expect(page).toHaveURL(/for-playwright#second-heading/)
|
||||
})
|
||||
|
||||
test('use sidebar to go to Hello World page', async ({ page }) => {
|
||||
await page.goto('/get-started')
|
||||
|
||||
await expect(page).toHaveTitle(/Getting started with HubGit/)
|
||||
|
||||
await page.getByTestId('product-sidebar').getByText('Quickstart').click()
|
||||
await page.getByTestId('product-sidebar').getByText('Hello World').click()
|
||||
await expect(page).toHaveURL(/\/en\/get-started\/quickstart\/hello-world/)
|
||||
await expect(page).toHaveTitle(/Hello World - GitHub Docs/)
|
||||
})
|
||||
|
||||
test('do a search from home page and click on "Foo" page', async ({ page }) => {
|
||||
test.skip(!SEARCH_TESTS, 'No local Elasticsearch, no tests involving search')
|
||||
|
||||
await page.goto('/')
|
||||
await page.getByTestId('site-search-input').click()
|
||||
await page.getByTestId('site-search-input').fill('serve playwright')
|
||||
await page.getByRole('button', { name: 'Search' }).click()
|
||||
await expect(page).toHaveURL(/\/search\?query=serve\+playwright/)
|
||||
await expect(page).toHaveTitle(/\d Search results for "serve playwright"/)
|
||||
|
||||
await page.getByRole('link', { name: 'For Playwright' }).click()
|
||||
|
||||
await expect(page).toHaveURL(/\/get-started\/foo\/for-playwright$/)
|
||||
await expect(page).toHaveTitle(/For Playwright/)
|
||||
})
|
||||
|
||||
test.describe('platform picker', () => {
|
||||
test('switch operating systems', async ({ page }) => {
|
||||
await page.goto('/get-started/liquid/platform-specific')
|
||||
|
||||
await page.getByTestId('platform-picker').getByRole('link', { name: 'Mac' }).click()
|
||||
await expect(page).toHaveURL(/\?platform=mac/)
|
||||
await expect(page.getByRole('heading', { name: /Macintosh/ })).toBeVisible()
|
||||
await expect(page.getByRole('heading', { name: /Windows 95/ })).not.toBeVisible()
|
||||
|
||||
await page.getByTestId('platform-picker').getByRole('link', { name: 'Windows' }).click()
|
||||
await expect(page).toHaveURL(/\?platform=windows/)
|
||||
await expect(page.getByRole('heading', { name: /Windows 95/ })).toBeVisible()
|
||||
await expect(page.getByRole('heading', { name: /Macintosh/ })).not.toBeVisible()
|
||||
})
|
||||
|
||||
test('minitoc matches picker', async ({ page }) => {
|
||||
// default platform set to windows in fixture fronmatter
|
||||
await page.goto('/get-started/liquid/platform-specific')
|
||||
await expect(
|
||||
page.getByTestId('minitoc').getByRole('link', { name: 'Macintosh until 1999' }),
|
||||
).not.toBeVisible()
|
||||
await expect(
|
||||
page.getByTestId('minitoc').getByRole('link', { name: 'Windows 95 was awesome' }),
|
||||
).toBeVisible()
|
||||
await page.getByTestId('platform-picker').getByRole('link', { name: 'Linux' }).click()
|
||||
await expect(
|
||||
page.getByTestId('minitoc').getByRole('link', { name: 'Macintosh until 1999' }),
|
||||
).not.toBeVisible()
|
||||
await expect(
|
||||
page.getByTestId('minitoc').getByRole('link', { name: 'The year of Linux on the desktop' }),
|
||||
).toBeVisible()
|
||||
})
|
||||
|
||||
test('remember last clicked OS', async ({ page }) => {
|
||||
await page.goto('/get-started/liquid/platform-specific')
|
||||
await page.getByTestId('platform-picker').getByRole('link', { name: 'Windows' }).click()
|
||||
|
||||
// Return and now the cookie should start us off on Windows again
|
||||
await page.goto('/get-started/liquid/platform-specific')
|
||||
await expect(page.getByRole('heading', { name: /Windows 95/ })).toBeVisible()
|
||||
await expect(page.getByRole('heading', { name: /Macintosh/ })).not.toBeVisible()
|
||||
})
|
||||
})
|
||||
|
||||
test.describe('tool picker', () => {
|
||||
test('switch tools', async ({ page }) => {
|
||||
await page.goto('/get-started/liquid/tool-specific')
|
||||
|
||||
await page.getByTestId('tool-picker').getByRole('link', { name: 'GitHub CLI' }).click()
|
||||
await expect(page).toHaveURL(/\?tool=cli/)
|
||||
await expect(page.getByText('this is cli content')).toBeVisible()
|
||||
await expect(page.getByText('this is webui content')).not.toBeVisible()
|
||||
|
||||
await page.getByTestId('tool-picker').getByRole('link', { name: 'Web browser' }).click()
|
||||
await expect(page).toHaveURL(/\?tool=webui/)
|
||||
await expect(page.getByText('this is cli content')).not.toBeVisible()
|
||||
await expect(page.getByText('this is desktop content')).not.toBeVisible()
|
||||
await expect(page.getByText('this is webui content')).toBeVisible()
|
||||
})
|
||||
|
||||
test('prefer default tool', async ({ page }) => {
|
||||
await page.goto('/get-started/liquid/tool-specific')
|
||||
|
||||
// defaultTool is set in the fixture frontmatter
|
||||
await expect(page.getByText('this is desktop content')).toBeVisible()
|
||||
await expect(page.getByText('this is webui content')).not.toBeVisible()
|
||||
await expect(page.getByText('this is cli content')).not.toBeVisible()
|
||||
})
|
||||
|
||||
test('remember last clicked tool', async ({ page }) => {
|
||||
await page.goto('/get-started/liquid/tool-specific')
|
||||
await page.getByTestId('tool-picker').getByRole('link', { name: 'Web browser' }).click()
|
||||
|
||||
// Return and now the cookie should start us off with Web UI content again
|
||||
await page.goto('/get-started/liquid/tool-specific')
|
||||
await expect(page.getByText('this is cli content')).not.toBeVisible()
|
||||
await expect(page.getByText('this is desktop content')).not.toBeVisible()
|
||||
await expect(page.getByText('this is webui content')).toBeVisible()
|
||||
})
|
||||
|
||||
test('minitoc matches picker', async ({ page }) => {
|
||||
// default tool set to desktop in fixture fronmatter
|
||||
await page.goto('/get-started/liquid/tool-specific')
|
||||
await expect(
|
||||
page.getByTestId('minitoc').getByRole('link', { name: 'Desktop section' }),
|
||||
).toBeVisible()
|
||||
await expect(
|
||||
page.getByTestId('minitoc').getByRole('link', { name: 'Webui section' }),
|
||||
).not.toBeVisible()
|
||||
await page.getByTestId('tool-picker').getByRole('link', { name: 'Web browser' }).click()
|
||||
await expect(
|
||||
page.getByTestId('minitoc').getByRole('link', { name: 'Desktop section' }),
|
||||
).not.toBeVisible()
|
||||
await expect(
|
||||
page.getByTestId('minitoc').getByRole('link', { name: 'Webui section' }),
|
||||
).toBeVisible()
|
||||
})
|
||||
})
|
||||
|
||||
test('navigate with side bar into article inside a map-topic inside a category', async ({
|
||||
page,
|
||||
}) => {
|
||||
// Our TreeView sidebar only shows "2 levels". If you click and expand
|
||||
// the category, you'll be able to see the map-topic and the article
|
||||
// within.
|
||||
await page.goto('/actions')
|
||||
await page.getByTestId('sidebar').getByText('Category').click()
|
||||
await page.getByText('Map & Topic').click()
|
||||
await page.getByText('<article>').click()
|
||||
await expect(page.getByRole('heading', { name: 'Article title' })).toBeVisible()
|
||||
await expect(page).toHaveURL(/actions\/category\/map-topic\/article/)
|
||||
})
|
||||
|
||||
test.describe('hover cards', () => {
|
||||
test('hover over link', async ({ page }) => {
|
||||
await page.goto('/pages/quickstart')
|
||||
|
||||
// hover over a link and check for intro content from hovercard
|
||||
await page.locator('#article-contents').getByRole('link', { name: 'Quickstart' }).hover()
|
||||
await expect(
|
||||
page.getByText(
|
||||
'Get started using GitHub to manage Git repositories and collaborate with others.',
|
||||
),
|
||||
).toBeVisible()
|
||||
|
||||
// now move the mouse away from hovering over the link, the hovercard should
|
||||
// no longer be visible
|
||||
await page.mouse.move(0, 0)
|
||||
await expect(
|
||||
page.getByText(
|
||||
'Get started using GitHub to manage Git repositories and collaborate with others.',
|
||||
),
|
||||
).not.toBeVisible()
|
||||
|
||||
// external links don't have a hovercard
|
||||
await page.getByRole('link', { name: 'github.com/github/docs' }).hover()
|
||||
await expect(page.getByTestId('popover')).not.toBeVisible()
|
||||
|
||||
// links in the main navigation sidebar don't have a hovercard
|
||||
await page.getByTestId('sidebar').getByRole('link', { name: 'Quickstart' }).hover()
|
||||
await expect(page.getByTestId('popover')).not.toBeVisible()
|
||||
|
||||
// links in the secondary minitoc sidebar don't have a hovercard
|
||||
await page
|
||||
.getByTestId('minitoc')
|
||||
.getByRole('link', { name: 'Regular internal link', exact: true })
|
||||
.hover()
|
||||
await expect(page.getByTestId('popover')).not.toBeVisible()
|
||||
|
||||
// links in the article intro have a hovercard
|
||||
await page.locator('#article-intro').getByRole('link', { name: 'article intro link' }).hover()
|
||||
await expect(page.getByText('You can use GitHub Pages to showcase')).toBeVisible()
|
||||
// this page's intro has two links; one in-page and one internal
|
||||
await page.locator('#article-intro').getByRole('link', { name: 'another link' }).hover()
|
||||
await expect(
|
||||
page.getByText('Follow this Hello World exercise to get started with GitHub.'),
|
||||
).toBeVisible()
|
||||
|
||||
// same page anchor links have a hovercard
|
||||
await page
|
||||
.locator('#article-contents')
|
||||
.getByRole('link', { name: 'introduction', exact: true })
|
||||
.hover()
|
||||
await expect(page.getByText('You can use GitHub Pages to showcase')).toBeVisible()
|
||||
|
||||
// links with formatted text need to work too
|
||||
await page.locator('#article-contents').getByRole('link', { name: 'Bold is strong' }).hover()
|
||||
await expect(page.getByText('The most basic of fixture data for GitHub')).toBeVisible()
|
||||
await page.locator('#article-contents').getByRole('link', { name: 'bar' }).hover()
|
||||
await expect(page.getByText("This page doesn't really have an intro")).toBeVisible()
|
||||
})
|
||||
|
||||
test('use keyboard shortcut to open hover card', async ({ page }) => {
|
||||
await page.goto('/pages/quickstart')
|
||||
|
||||
// Simply putting focus on the link should not open the hovercard
|
||||
await page.locator('#article-contents').getByRole('link', { name: 'Quickstart' }).focus()
|
||||
await expect(
|
||||
page.getByText(
|
||||
'Get started using GitHub to manage Git repositories and collaborate with others.',
|
||||
),
|
||||
).not.toBeVisible()
|
||||
|
||||
// Once a link has got focus, you can use Alt+ArrowUp to open the hovercard
|
||||
await page.keyboard.press('Alt+ArrowUp')
|
||||
await expect(
|
||||
page.getByText(
|
||||
'Get started using GitHub to manage Git repositories and collaborate with others.',
|
||||
),
|
||||
).toBeVisible()
|
||||
|
||||
// Press Escape to close it
|
||||
await page.keyboard.press('Escape')
|
||||
await expect(
|
||||
page.getByText(
|
||||
'Get started using GitHub to manage Git repositories and collaborate with others.',
|
||||
),
|
||||
).not.toBeVisible()
|
||||
})
|
||||
|
||||
test('internal links get a aria-roledescription and aria-describedby', async ({ page }) => {
|
||||
await page.goto('/pages/quickstart')
|
||||
const link = page.locator('#article-contents').getByRole('link', { name: 'Quickstart' })
|
||||
await expect(link).toHaveAttribute('aria-roledescription', 'hover card')
|
||||
|
||||
// The link gets a `aria-describedby="...ID..."` attribute that points to
|
||||
// another element in the DOM that has the description text.
|
||||
const id = 'popover-describedby'
|
||||
await expect(link).toHaveAttribute('aria-describedby', id)
|
||||
await expect(page.locator(`#${id}`)).toHaveText('Press alt+up to activate')
|
||||
})
|
||||
})
|
||||
|
||||
test.describe('test nav at different viewports', () => {
|
||||
test('xx-large viewports - 1400+', async ({ page }) => {
|
||||
page.setViewportSize({
|
||||
width: 1400,
|
||||
height: 700,
|
||||
})
|
||||
await page.goto('/get-started/foo/bar')
|
||||
|
||||
// in article breadcrumbs at our custom xl viewport should remove last
|
||||
// breadcrumb so for this page we should only have 'Get Started / Foo'
|
||||
expect(await page.getByTestId('breadcrumbs-in-article').getByRole('link').all()).toHaveLength(2)
|
||||
await expect(page.getByTestId('breadcrumbs-in-article').getByText('Foo')).toBeVisible()
|
||||
await expect(page.getByTestId('breadcrumbs-in-article').getByText('Bar')).not.toBeVisible()
|
||||
})
|
||||
|
||||
test('large -> x-large viewports - 1012+', async ({ page }) => {
|
||||
page.setViewportSize({
|
||||
width: 1013,
|
||||
height: 700,
|
||||
})
|
||||
await page.goto('/get-started/foo/bar')
|
||||
|
||||
// version picker should be visible
|
||||
await page
|
||||
.getByRole('button', {
|
||||
name: 'Select GitHub product version: current version is free-pro-team@latest',
|
||||
})
|
||||
.click()
|
||||
expect((await page.getByRole('menuitemradio').all()).length).toBeGreaterThan(0)
|
||||
await expect(page.getByRole('menuitemradio', { name: 'Enterprise Cloud' })).toBeVisible()
|
||||
|
||||
// language picker is visible
|
||||
await page.getByRole('button', { name: 'Select language: current language is English' }).click()
|
||||
await expect(page.getByRole('menuitemradio', { name: 'English' })).toBeVisible()
|
||||
|
||||
// header sign up button is visible
|
||||
await expect(page.getByTestId('header-signup')).toBeVisible()
|
||||
})
|
||||
|
||||
test('large viewports - 1012-1279', async ({ page }) => {
|
||||
page.setViewportSize({
|
||||
width: 1013,
|
||||
height: 700,
|
||||
})
|
||||
await page.goto('/get-started/foo/bar')
|
||||
|
||||
// breadcrumbs show up in the header, for this page we should have
|
||||
// 3 items 'Get Started / Foo / Bar'
|
||||
// in-article breadcrumbs don't show up
|
||||
await expect(page.getByTestId('breadcrumbs-header')).toBeVisible()
|
||||
expect(await page.getByTestId('breadcrumbs-header').getByRole('link').all()).toHaveLength(3)
|
||||
await expect(page.getByTestId('breadcrumbs-in-article')).not.toBeVisible()
|
||||
|
||||
// hamburger button for sidebar overlay is visible
|
||||
await expect(page.getByTestId('sidebar-hamburger')).toBeVisible()
|
||||
await page.getByTestId('sidebar-hamburger').click()
|
||||
await expect(page.getByTestId('sidebar-product-dialog')).toBeVisible()
|
||||
})
|
||||
|
||||
test('medium viewports - 768-1011', async ({ page }) => {
|
||||
page.setViewportSize({
|
||||
width: 1000,
|
||||
height: 700,
|
||||
})
|
||||
await page.goto('/get-started/foo/bar')
|
||||
|
||||
// version picker is visible
|
||||
await page
|
||||
.getByRole('button', {
|
||||
name: 'Select GitHub product version: current version is free-pro-team@latest',
|
||||
})
|
||||
.click()
|
||||
expect((await page.getByRole('menuitemradio').all()).length).toBeGreaterThan(0)
|
||||
await expect(page.getByRole('menuitemradio', { name: 'Enterprise Cloud' })).toBeVisible()
|
||||
|
||||
// language picker is in mobile menu
|
||||
await page.getByTestId('mobile-menu').click()
|
||||
await page.getByTestId('language-picker')
|
||||
await expect(page.getByRole('menuitemradio', { name: 'English' })).toBeVisible()
|
||||
|
||||
// sign up button is in mobile menu
|
||||
await expect(page.getByTestId('mobile-signup')).toBeVisible()
|
||||
|
||||
// hamburger button for sidebar overlay is visible
|
||||
await expect(page.getByTestId('sidebar-hamburger')).toBeVisible()
|
||||
await page.getByTestId('sidebar-hamburger').click()
|
||||
await expect(page.getByTestId('sidebar-product-dialog')).toBeVisible()
|
||||
})
|
||||
|
||||
test('small viewports - 544-767', async ({ page }) => {
|
||||
page.setViewportSize({
|
||||
width: 555,
|
||||
height: 700,
|
||||
})
|
||||
await page.goto('/get-started/foo/bar')
|
||||
|
||||
// header sign-up button is not visible
|
||||
await expect(page.getByTestId('header-signup')).not.toBeVisible()
|
||||
|
||||
// language picker is not visible
|
||||
await expect(page.getByTestId('language-picker')).not.toBeVisible()
|
||||
|
||||
// version picker is visible
|
||||
await expect(
|
||||
page.getByRole('button', {
|
||||
name: 'Select GitHub product version: current version is free-pro-team@latest',
|
||||
}),
|
||||
).toBeVisible()
|
||||
|
||||
// language picker is in mobile menu
|
||||
await page.getByTestId('mobile-menu').click()
|
||||
await page.getByTestId('language-picker')
|
||||
await expect(page.getByRole('menuitemradio', { name: 'English' })).toBeVisible()
|
||||
|
||||
// sign up button is in mobile menu
|
||||
await expect(page.getByTestId('mobile-signup')).toBeVisible()
|
||||
|
||||
// hamburger button for sidebar overlay is visible
|
||||
await expect(page.getByTestId('sidebar-hamburger')).toBeVisible()
|
||||
await page.getByTestId('sidebar-hamburger').click()
|
||||
await expect(page.getByTestId('sidebar-product-dialog')).toBeVisible()
|
||||
})
|
||||
|
||||
test('x-small viewports - 0-544', async ({ page }) => {
|
||||
page.setViewportSize({
|
||||
width: 345,
|
||||
height: 700,
|
||||
})
|
||||
await page.goto('/get-started/foo/bar')
|
||||
|
||||
// header sign-up button is not visible
|
||||
await expect(page.getByTestId('header-signup')).not.toBeVisible()
|
||||
|
||||
// language picker is not visible
|
||||
await expect(page.getByTestId('language-picker')).not.toBeVisible()
|
||||
|
||||
// version picker is not visible
|
||||
await expect(
|
||||
page.getByRole('button', {
|
||||
name: 'Select GitHub product version: current version is free-pro-team@latest',
|
||||
}),
|
||||
).not.toBeVisible()
|
||||
|
||||
// version picker is in mobile menu
|
||||
await expect(page.getByTestId('version-picker')).not.toBeVisible()
|
||||
await page.getByTestId('mobile-menu').click()
|
||||
await expect(page.getByTestId('open-mobile-menu').getByTestId('version-picker')).toBeVisible()
|
||||
|
||||
// language picker is in mobile menu
|
||||
await expect(page.getByTestId('open-mobile-menu').getByTestId('language-picker')).toBeVisible()
|
||||
|
||||
// sign up button is in mobile menu
|
||||
await expect(page.getByTestId('mobile-signup')).toBeVisible()
|
||||
|
||||
// hamburger button for sidebar overlay is visible
|
||||
await expect(page.getByTestId('sidebar-hamburger')).toBeVisible()
|
||||
await page.getByTestId('sidebar-hamburger').click()
|
||||
await expect(page.getByTestId('sidebar-product-dialog')).toBeVisible()
|
||||
})
|
||||
|
||||
test('do a search when the viewport is x-small', async ({ page }) => {
|
||||
test.skip(!SEARCH_TESTS, 'No local Elasticsearch, no tests involving search')
|
||||
|
||||
page.setViewportSize({
|
||||
width: 500,
|
||||
height: 700,
|
||||
})
|
||||
await page.goto('/get-started/foo/bar')
|
||||
await page.getByRole('button', { name: 'Open Search Bar' }).click()
|
||||
await page.getByTestId('site-search-input').click()
|
||||
await page.getByTestId('site-search-input').fill('serve playwright')
|
||||
await page.getByTestId('site-search-input').press('Enter')
|
||||
await expect(page).toHaveURL(/\/search\?query=serve\+playwright/)
|
||||
await expect(page).toHaveTitle(/\d Search results for "serve playwright"/)
|
||||
})
|
||||
|
||||
test('do a search when the viewport is medium', async ({ page }) => {
|
||||
test.skip(!SEARCH_TESTS, 'No local Elasticsearch, no tests involving search')
|
||||
|
||||
page.setViewportSize({
|
||||
width: 1000,
|
||||
height: 700,
|
||||
})
|
||||
await page.goto('/get-started/foo/bar')
|
||||
await page.getByTestId('site-search-input').click()
|
||||
await page.getByTestId('site-search-input').fill('serve playwright')
|
||||
await page.getByTestId('site-search-input').press('Enter')
|
||||
await expect(page).toHaveURL(/\/search\?query=serve\+playwright/)
|
||||
await expect(page).toHaveTitle(/\d Search results for "serve playwright"/)
|
||||
})
|
||||
})
|
||||
|
||||
test.describe('survey', () => {
|
||||
test('happy path, thumbs up and enter email', async ({ page }) => {
|
||||
let fulfilled = 0
|
||||
// Important to set this up *before* interacting with the page
|
||||
// in case of possible race conditions.
|
||||
await page.route('**/api/events', (route, request) => {
|
||||
route.fulfill({})
|
||||
expect(request.method()).toBe('POST')
|
||||
fulfilled++
|
||||
// At the time of writing you can't get the posted payload
|
||||
// when you use `navigator.sendBeacon(url, data)`.
|
||||
// So we can't make assertions about the payload.
|
||||
// See https://github.com/microsoft/playwright/issues/12231
|
||||
})
|
||||
|
||||
await page.goto('/get-started/foo/for-playwright')
|
||||
|
||||
// The label is visually an SVG. Finding it by its `for` value feels easier.
|
||||
await page.locator('[for=survey-yes]').click()
|
||||
await page.getByPlaceholder('email@example.com').click()
|
||||
await page.getByPlaceholder('email@example.com').fill('test@example.com')
|
||||
|
||||
await page.getByRole('button', { name: 'Send' }).click()
|
||||
// One for the page view event, one for the thumbs up click, one for
|
||||
// the submission.
|
||||
expect(fulfilled).toBe(1 + 2)
|
||||
await expect(page.getByTestId('survey-end')).toBeVisible()
|
||||
})
|
||||
|
||||
test('thumbs down without filling in the form sends an API POST', async ({ page }) => {
|
||||
let fulfilled = 0
|
||||
// Important to set this up *before* interacting with the page
|
||||
// in case of possible race conditions.
|
||||
await page.route('**/api/events', (route, request) => {
|
||||
route.fulfill({})
|
||||
expect(request.method()).toBe('POST')
|
||||
fulfilled++
|
||||
// At the time of writing you can't get the posted payload
|
||||
// when you use `navigator.sendBeacon(url, data)`.
|
||||
// So we can't make assertions about the payload.
|
||||
// See https://github.com/microsoft/playwright/issues/12231
|
||||
})
|
||||
|
||||
await page.goto('/get-started/foo/for-playwright')
|
||||
|
||||
await page.locator('[for=survey-yes]').click()
|
||||
// One for the page view event and one for the thumbs up click
|
||||
expect(fulfilled).toBe(1 + 1)
|
||||
|
||||
await expect(page.getByRole('button', { name: 'Send' })).toBeVisible()
|
||||
await page.getByRole('button', { name: 'Cancel' }).click()
|
||||
await expect(page.getByRole('button', { name: 'Send' })).not.toBeVisible()
|
||||
})
|
||||
})
|
||||
|
||||
test.describe('rest API reference pages', () => {
|
||||
test('REST actions', async ({ page }) => {
|
||||
await page.goto('/rest')
|
||||
// Before using the sidebar, make sure the page has redirected to a
|
||||
// URL that has that `?apiVersion=` query parameter.
|
||||
await expect(page).toHaveURL(/\/en\/rest\?apiVersion=/)
|
||||
await page.getByTestId('sidebar').getByText('Actions').click()
|
||||
await page.getByTestId('sidebar').getByLabel('Artifacts').click()
|
||||
await page.getByLabel('About artifacts in GitHub Actions').click()
|
||||
await expect(page).toHaveURL(/\/en\/rest\/actions\/artifacts\?apiVersion=/)
|
||||
await expect(page).toHaveTitle(/GitHub Actions Artifacts - GitHub Docs/)
|
||||
})
|
||||
})
|
||||
|
||||
test.describe('translations', () => {
|
||||
test('view Japanese home page', async ({ page }) => {
|
||||
await page.goto('/ja')
|
||||
await expect(page.getByRole('heading', { name: '日本 GitHub Docs' })).toBeVisible()
|
||||
})
|
||||
|
||||
test('switch to Japanese from English using widget on home page', async ({ page }) => {
|
||||
await page.goto('/en')
|
||||
await page.getByRole('button', { name: 'Select language: current language is English' }).click()
|
||||
await page.getByRole('menuitemradio', { name: '日本語' }).click()
|
||||
await expect(page).toHaveURL('/ja')
|
||||
await expect(page.getByRole('heading', { name: '日本 GitHub Docs' })).toBeVisible()
|
||||
|
||||
// Having done this once, should now use a cookie to redirect back to Japanese
|
||||
await page.goto('/')
|
||||
await expect(page).toHaveURL('/ja')
|
||||
})
|
||||
|
||||
test('switch to Japanese from English using widget on article', async ({ page }) => {
|
||||
await page.goto('/get-started/quickstart/hello-world')
|
||||
await page.getByRole('button', { name: 'Select language: current language is English' }).click()
|
||||
await page.getByRole('menuitemradio', { name: '日本語' }).click()
|
||||
await expect(page).toHaveURL('/ja/get-started/quickstart/hello-world')
|
||||
await expect(page.getByRole('heading', { name: 'こんにちは World' })).toBeVisible()
|
||||
|
||||
// Having done this once, should now use a cookie to redirect
|
||||
// back to Japanese.
|
||||
// Playwright will cache this redirect, so we need to add something
|
||||
// to "cache bust" the URL
|
||||
const cb = `?cb=${Math.random()}`
|
||||
await page.goto('/get-started/quickstart/hello-world' + cb)
|
||||
await expect(page).toHaveURL('/ja/get-started/quickstart/hello-world' + cb)
|
||||
|
||||
// If you go, with the Japanese cookie, to the English page directly,
|
||||
// it will offer a link to the Japanese URL in a banner.
|
||||
await page.goto('/en/get-started/quickstart/hello-world')
|
||||
await page.getByRole('link', { name: 'Japanese' }).click()
|
||||
await expect(page).toHaveURL('/ja/get-started/quickstart/hello-world')
|
||||
})
|
||||
})
|
||||
Reference in New Issue
Block a user