Skip to content

Commit cd7a504

Browse files
lamATnginxlamATnginx
committed
Tests: Added new UI smoke tests
1 parent 4fd0505 commit cd7a504

20 files changed

+222
-136
lines changed

‎.github/workflows/playwright.yml‎

Lines changed: 7 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
name: Testing for visual regression on old theme
1+
name: Running Playwright test on UI
22

33
# Run the workflow when code is pushed or when a pull request is created
44
on:
@@ -25,19 +25,16 @@ jobs:
2525
- name: Install dependencies and playwright browsers
2626
run: cd tests && npm ci && npx playwright install --with-deps
2727
- name: Run Playwright tests
28-
id: test-visual
28+
id: test-ui
2929
run: |
3030
make tests | tee output.log
31-
if grep -q -e "Error: A snapshot doesn't exist at" -e "Screenshot comparison failed" output.log; then
32-
echo "Playwright tests failed due to a snapshot issue."
33-
exit 1
34-
elif grep -q "failed" output.log; then
35-
echo "Playwright tests failed due to a non-snapshot issue."
31+
if grep -q "failed" output.log; then
32+
echo "Playwright tests failed. Please view the Playwright report to see full error."
3633
exit 1
3734
fi
3835
- uses: actions/upload-artifact@v4
3936
id: artifact-upload
40-
if: ${{ !cancelled() && failure() && steps.test-visual.conclusion == 'failure' }}
37+
if: ${{ !cancelled() && failure() && steps.test-ui.conclusion == 'failure' }}
4138
with:
4239
name: playwright-report
4340
path: tests/playwright-report/
@@ -47,10 +44,9 @@ jobs:
4744
if: ${{ failure() }}
4845
with:
4946
script: |
50-
const body = `### <span aria-hidden="true">❌</span> Playwright visual snapshot differences were detected.
47+
const body = `### <span aria-hidden="true">❌</span> Playwright differences were detected.
5148
52-
View the [Playwright report](${{ steps.artifact-upload.outputs.artifact-url }})
53-
**To approve the snapshot changes and update the snapshots, please comment:** /approve-snapshots`;
49+
View the [Playwright report](${{ steps.artifact-upload.outputs.artifact-url }})`;
5450
5551
await github.rest.issues.createComment({
5652
issue_number: context.issue.number,

‎.github/workflows/update-screenshot.yml‎

Lines changed: 0 additions & 58 deletions
This file was deleted.

‎layouts/404.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{{ define "main"}}
22

3-
<div class="content no-sidebar">
4-
<div class="not-found-container">
3+
<div class="content no-sidebar" data-testid="content">
4+
<div class="not-found-container" data-testid="not-found-container">
55
<h1 class="info-header">
66
HTTP 404 - Page not found
77
</h1>

‎layouts/_default/baseof.html‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -44,17 +44,17 @@
4444
<input type="checkbox" id="search-standalone-header-panel" class="search-standalone-header-panel" hidden/>
4545
<input type="checkbox" id="sidebar-panel" class="sidebar-panel" hidden/>
4646
<div class="grid-container">
47-
<aside class="sidebar">
47+
<aside class="sidebar" data-testid="sidebar">
4848
{{ partial "sidebar-v2.html" . }}
4949
</aside>
5050

51-
<header class="header">
51+
<header class="header" data-testid="header">
5252
{{ block "header" . }}{{end}}
5353
</header>
5454

5555
{{ block "main" . }}{{ end }}
5656

57-
<footer class="footer">
57+
<footer class="footer" data-testid="footer">
5858
{{ block "footer-v2" . }}
5959
{{ partial "footer-v2.html" . }}
6060
{{ end }}

‎layouts/_default/list.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{{ define "main" }}
22

3-
<main class="content" role="main">
3+
<main class="content" role="main" data-testid="content">
44
<div data-cms-edit="content" class="text-content list-page">
55
<div class="breadcrumb-layout">
66
{{ if not .IsHome }}
@@ -30,7 +30,7 @@ <h1>{{ .Title }}</h1>
3030

3131
<h2> In this section </h2>
3232
<div class="card-section">
33-
<div class="card-section-content card-grid">
33+
<div class="card-section-content card-grid" data-testid="header-search-dropdown">
3434
{{ range .Pages.ByWeight }}
3535
<a href="{{ .Permalink }}" alt="{{ .Title }}" class="card" data-grid="first-two-thirds">
3636
<div class="card-container">

‎layouts/_default/single.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
{{ define "main" }}
2-
<main class="content">
2+
<main class="content" data-testid="content">
33
<!-- Replace icons -->
44
{{ $content := partial "icon-replacement.html" (dict "content" .Content) }}
55

‎layouts/partials/api.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<!--Use wide page layout for the API reference pages-->
22
<div class="nginx-docs-api-container">
3-
<div id="api-component" class="content">
3+
<div id="api-component" class="content" data-testid="content">
44
{{ .Content}}
55
</div>
66
</div>

‎layouts/partials/footer-v2.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
<div class="footer-layout">
2-
<div class="footer-f5-trademark">
2+
<div class="footer-f5-trademark" data-testid="footer-f5-trademark">
33
<img class="f5-logo-footer" src="{{ "/images/icons/Logo_F5.svg" | absURL }}" alt="F5 logo">
44
<p>©2025 F5, Inc. All rights reserved. NGINX is a registered trademark of F5, Inc.</p>
55
</div>
6-
<div class="footer-useful-links">
6+
<div class="footer-useful-links" data-testid="footer-useful-links">
77
<a
88
href="https://www.f5.com/company/policies/trademarks"
99
rel="noopener"

‎layouts/partials/header.html‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,34 +1,34 @@
11
{{ define "header" }}
22
<div class="header-base">
33
<div class="header-container">
4-
<div class="header__control">
4+
<div class="header__control" data-testid="header__control">
55
<div class="header__control--sidebar">
6-
<label class="header__control--sidebar--close" for="sidebar-panel">
6+
<label class="header__control--sidebar--close" for="sidebar-panel" data-testid="header__control--sidebar--close">
77
{{ partial "lucide" (dict "context" . "icon" "panel-left-close") }}
88
</label>
9-
<label class="header__control--sidebar--open" for="sidebar-panel">
9+
<label class="header__control--sidebar--open" for="sidebar-panel" data-testid="header__control--sidebar--open">
1010
{{ partial "lucide" (dict "context" . "icon" "panel-left-open") }}
1111
</label>
1212
</div>
1313
{{ if ( not ( in .Site.Params.buildtype "package" ) ) }}
1414
<!-- Mobile button -->
15-
<label class="header__search--mobile--search--button"for="search-standalone-header-panel">
15+
<label class="header__search--mobile--search--button"for="search-standalone-header-panel" data-testid="header__search--mobile--search--button">
1616
{{ partial "lucide" (dict "context" . "icon" "search") }}
1717
</label>
18-
<div class="header__search">
18+
<div class="header__search" data-testid="header__search">
1919
<!-- Standalone search box. -->
2020
{{ partial "coveo-atomic-search.html" (dict "id" "search-standalone-header") }}
2121
</div>
2222
{{ end }}
2323
</div>
2424

25-
<div class="header__logo">
25+
<div class="header__logo" data-testid="header__logo">
2626
<a class="header__logo-link" href="{{ .Site.BaseURL | relLangURL }}" alt="NGINX Docs Home">
2727
<img class="header__img" src="{{ "/images/icons/NGINX-Open-Source-product-icon.svg" | absURL }}" alt="NGINX Docs">
2828
</a>
2929
</div>
3030

31-
<div class="header__f5sites">
31+
<div class="header__f5sites" data-testid="header__f5sites">
3232
{{ $f5Sites := slice
3333
(dict "title" "DevCentral" "url" "https://community.f5.com/" "description" "Connect & learn in our hosted community")
3434
(dict "title" "MyF5" "url" "https://my.f5.com/" "description" "Your key to everything F5, including support, registration keys, and subscriptions")
@@ -37,7 +37,7 @@
3737

3838
<div class="navbar navbar-nav">
3939
<div class="nav-item-explore active">
40-
<button id="navbar-sites-button" class="button navbar-button dropdown-button" data-testid="header__f5sites_button">
40+
<button id="navbar-sites-button" class="button navbar-button dropdown-button" data-testid="header__f5sites__button">
4141
F5 Sites
4242
<span class="header__f5sites--icon">
4343
{{ partial "lucide" (dict "context" . "icon" "chevron-down") }}
@@ -58,7 +58,7 @@
5858

5959
</div>
6060
</div>
61-
<div class="header-search-dropdown">
61+
<div class="header-search-dropdown" data-testid="header-search-dropdown-mobile">
6262
<atomic-external selector="#search-standalone-header">
6363
{{ $redirectUrl := default .Site.Params.coveo_search_redirect "/search.html" }}
6464
<atomic-search-box redirection-url={{ $redirectUrl }}></atomic-search-box>

‎layouts/partials/sidebar-list.html‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
{{ $firstSection := .firstSection }}
44
{{ $idPrefix := .idPrefix }}
55
{{ with $firstSection }}
6-
<ul class="sidebar__ul">
6+
<ul class="sidebar__ul" data-testid="sidebar__ul">
77
{{ $pages := .Pages.ByWeight }}
88
{{ range $index, $p := $pages }}
99
{{- $onPage := eq $currentUrl $p.Permalink -}}
@@ -14,10 +14,11 @@
1414
{{- $nextIndex := add $index 1 -}}
1515
{{- $nextLink := index $pages $nextIndex -}}
1616
{{ if eq $p.Kind "section" }}
17-
<li class="sidebar__section">
17+
<li class="sidebar__section" data-testid="sidebar__section">
1818
<button
1919
id="{{ $linkID }}"
2020
class="sidebar__toggle {{ if $isAncestor }}sidebar__toggle--ancestor{{ end }}"
21+
data-testid="sidebar__section__toggle"
2122
aria-expanded="{{ $shouldExpand }}"
2223
aria-controls="{{ $sectionID }}"
2324
>
@@ -33,7 +34,7 @@
3334
>
3435
{{ if and .Content (gt (len .Pages) 0) }}
3536
<ul>
36-
<li class="sidebar__page">
37+
<li class="sidebar__page" data-testid="sidebar__page">
3738
<a
3839
href="{{ $p.Permalink }}"
3940
class="sidebar__link {{ if $onPage }}sidebar__link--current{{ end }}"
@@ -57,7 +58,7 @@
5758
{{- $tocHasItems := (in $p.TableOfContents "<li>") -}}
5859
{{- $pageHasTOC := (and $onPage $tocHasItems $p.Params.toc) -}}
5960
{{- $tocID := printf "%stoc-%s" $idPrefix (urlize $p.Permalink) -}}
60-
<li class="sidebar__page">
61+
<li class="sidebar__page" data-testid="sidebar__page">
6162
{{ if $pageHasTOC }}
6263
<button
6364
class="sidebar__toggle sidebar__link sidebar__link--current"

0 commit comments

Comments
 (0)