From 80fe002c04cc2a6d93302f07b865b7d19c6a4c11 Mon Sep 17 00:00:00 2001 From: Stuart Langridge Date: Tue, 24 Jun 2025 18:18:20 +0100 Subject: [PATCH] Very basic test suite infrastructure A bash script, run-tests.sh, which runs a web page test suite. This installs [playwright](https://playwright.dev) if not already installed, and a headless chromium, and then runs all the tests it discovers. A very very basic test is in tests/ but this is mostly there to confirm that the infrastructure works. It should be an example for how to write more tests, though, along with the playwright documentation. Note that we also add a new envar, HUGO_SKIP_OPENGRAPH; if this envar is defined, we skip generating the opengraph images. The test suite uses this because it means that spinning up the server as a fresh build only takes a few seconds and not three minutes. --- .gitignore | 8 ++ github-workflows-playwright.yml | 27 ++++++ package-lock.json | 97 +++++++++++++++++++ package.json | 21 ++++ playwright.config.js | 83 ++++++++++++++++ ...s_3ec8e0fa91f2f30b6b4b66f36c8c1e78.content | 1 - ...scss_3ec8e0fa91f2f30b6b4b66f36c8c1e78.json | 1 - run-tests.sh | 36 +++++++ tests/basics.spec.js | 19 ++++ themes/ndt2/layouts/partials/opengraph.html | 2 + 10 files changed, 293 insertions(+), 2 deletions(-) create mode 100644 github-workflows-playwright.yml create mode 100644 package-lock.json create mode 100644 package.json create mode 100644 playwright.config.js delete mode 100644 resources/_gen/assets/sass/main.scss_3ec8e0fa91f2f30b6b4b66f36c8c1e78.content delete mode 100644 resources/_gen/assets/sass/main.scss_3ec8e0fa91f2f30b6b4b66f36c8c1e78.json create mode 100644 run-tests.sh create mode 100644 tests/basics.spec.js diff --git a/.gitignore b/.gitignore index 8b10eb50342..4dd9f04a197 100644 --- a/.gitignore +++ b/.gitignore @@ -5,3 +5,11 @@ public/ .venv *~ **/.DS_Store + +# Playwright +node_modules/ +/test-results/ +/playwright-report/ +/blob-report/ +/playwright/.cache/ +test-results/ diff --git a/github-workflows-playwright.yml b/github-workflows-playwright.yml new file mode 100644 index 00000000000..3eb13143c3d --- /dev/null +++ b/github-workflows-playwright.yml @@ -0,0 +1,27 @@ +name: Playwright Tests +on: + push: + branches: [ main, master ] + pull_request: + branches: [ main, master ] +jobs: + test: + timeout-minutes: 60 + runs-on: ubuntu-latest + steps: + - uses: actions/checkout@v4 + - uses: actions/setup-node@v4 + with: + node-version: lts/* + - name: Install dependencies + run: npm ci + - name: Install Playwright Browsers + run: npx playwright install --with-deps + - name: Run Playwright tests + run: npx playwright test + - uses: actions/upload-artifact@v4 + if: ${{ !cancelled() }} + with: + name: playwright-report + path: playwright-report/ + retention-days: 30 diff --git a/package-lock.json b/package-lock.json new file mode 100644 index 00000000000..69b6b1b839c --- /dev/null +++ b/package-lock.json @@ -0,0 +1,97 @@ +{ + "name": "nerdydaytrips", + "version": "0.0.0", + "lockfileVersion": 3, + "requires": true, + "packages": { + "": { + "name": "nerdydaytrips", + "version": "0.0.0", + "license": "UNLICENSED", + "devDependencies": { + "@playwright/test": "^1.53.1", + "@types/node": "^24.0.3" + } + }, + "node_modules/@playwright/test": { + "version": "1.53.1", + "resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.53.1.tgz", + "integrity": "sha512-Z4c23LHV0muZ8hfv4jw6HngPJkbbtZxTkxPNIg7cJcTc9C28N/p2q7g3JZS2SiKBBHJ3uM1dgDye66bB7LEk5w==", + "dev": true, + "license": "Apache-2.0", + "dependencies": { + "playwright": "1.53.1" + }, + "bin": { + "playwright": "cli.js" + }, + "engines": { + "node": ">=18" + } + }, + "node_modules/@types/node": { + "version": "24.0.3", + "resolved": "https://registry.npmjs.org/@types/node/-/node-24.0.3.tgz", + "integrity": "sha512-R4I/kzCYAdRLzfiCabn9hxWfbuHS573x+r0dJMkkzThEa7pbrcDWK+9zu3e7aBOouf+rQAciqPFMnxwr0aWgKg==", + "dev": true, + "license": "MIT", + "dependencies": { + "undici-types": "~7.8.0" + } + }, + "node_modules/fsevents": { + "version": "2.3.2", + "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz", + "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==", + "dev": true, + "hasInstallScript": true, + "license": "MIT", + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": "^8.16.0 || ^10.6.0 || >=11.0.0" + } + }, + "node_modules/playwright": { + "version": "1.53.1", + "resolved": "https://registry.npmjs.org/playwright/-/playwright-1.53.1.tgz", + "integrity": "sha512-LJ13YLr/ocweuwxyGf1XNFWIU4M2zUSo149Qbp+A4cpwDjsxRPj7k6H25LBrEHiEwxvRbD8HdwvQmRMSvquhYw==", + "dev": true, + "license": "Apache-2.0", + "dependencies": { + "playwright-core": "1.53.1" + }, + "bin": { + "playwright": "cli.js" + }, + "engines": { + "node": ">=18" + }, + "optionalDependencies": { + "fsevents": "2.3.2" + } + }, + "node_modules/playwright-core": { + "version": "1.53.1", + "resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.53.1.tgz", + "integrity": "sha512-Z46Oq7tLAyT0lGoFx4DOuB1IA9D1TPj0QkYxpPVUnGDqHHvDpCftu1J2hM2PiWsNMoZh8+LQaarAWcDfPBc6zg==", + "dev": true, + "license": "Apache-2.0", + "bin": { + "playwright-core": "cli.js" + }, + "engines": { + "node": ">=18" + } + }, + "node_modules/undici-types": { + "version": "7.8.0", + "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-7.8.0.tgz", + "integrity": "sha512-9UJ2xGDvQ43tYyVMpuHlsgApydB8ZKfVYTsLDhXkFL/6gfkp+U8xTGdh8pMJv1SpZna0zxG1DwsKZsreLbXBxw==", + "dev": true, + "license": "MIT" + } + } +} diff --git a/package.json b/package.json new file mode 100644 index 00000000000..eb058f81016 --- /dev/null +++ b/package.json @@ -0,0 +1,21 @@ +{ + "name": "nerdydaytrips", + "version": "0.0.0", + "description": "nerdydaytrips", + "main": "no,js", + "scripts": {}, + "repository": { + "type": "git", + "url": "git+https://github.com/NerdyDayTrips/website.git" + }, + "author": "popey", + "license": "UNLICENSED", + "bugs": { + "url": "https://github.com/NerdyDayTrips/website/issues" + }, + "homepage": "https://github.com/NerdyDayTrips/website#readme", + "devDependencies": { + "@playwright/test": "^1.53.1", + "@types/node": "^24.0.3" + } +} diff --git a/playwright.config.js b/playwright.config.js new file mode 100644 index 00000000000..f329e6291cd --- /dev/null +++ b/playwright.config.js @@ -0,0 +1,83 @@ +// @ts-check +import { defineConfig, devices } from '@playwright/test'; + +/** + * Read environment variables from file. + * https://github.com/motdotla/dotenv + */ +// import dotenv from 'dotenv'; +// import path from 'path'; +// dotenv.config({ path: path.resolve(__dirname, '.env') }); + +/** + * @see https://playwright.dev/docs/test-configuration + */ +export default defineConfig({ + testDir: './tests', + /* Run tests in files in parallel */ + fullyParallel: true, + /* Fail the build on CI if you accidentally left test.only in t + he source code. */ + forbidOnly: !!process.env.CI, + /* Retry on CI only */ + retries: process.env.CI ? 2 : 0, + /* Opt out of parallel tests on CI. */ + workers: process.env.CI ? 1 : undefined, + /* Reporter to use. See https://playwright.dev/docs/test-reporters */ + reporter: 'list', + /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */ + use: { + /* Base URL to use in actions like `await page.goto('/')`. */ + // baseURL: 'http://localhost:3000', + + /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */ + trace: 'on-first-retry', + }, + + /* Configure projects for major browsers */ + projects: [ + { + name: 'chromium', + use: { ...devices['Desktop Chrome'] }, + }, + /* + { + name: 'firefox', + use: { ...devices['Desktop Firefox'] }, + }, + + { + name: 'webkit', + use: { ...devices['Desktop Safari'] }, + }, + */ + + /* Test against mobile viewports. */ + // { + // name: 'Mobile Chrome', + // use: { ...devices['Pixel 5'] }, + // }, + // { + // name: 'Mobile Safari', + // use: { ...devices['iPhone 12'] }, + // }, + + /* Test against branded browsers. */ + // { + // name: 'Microsoft Edge', + // use: { ...devices['Desktop Edge'], channel: 'msedge' }, + // }, + // { + // name: 'Google Chrome', + // use: { ...devices['Desktop Chrome'], channel: 'chrome' }, + // }, + ], + + /* Run your local dev server before starting the tests */ + // webServer: { + // command: 'npm run start', + // url: 'http://localhost:3000', + // reuseExistingServer: !process.env.CI, + // }, +}); + diff --git a/resources/_gen/assets/sass/main.scss_3ec8e0fa91f2f30b6b4b66f36c8c1e78.content b/resources/_gen/assets/sass/main.scss_3ec8e0fa91f2f30b6b4b66f36c8c1e78.content deleted file mode 100644 index 4d136947110..00000000000 --- a/resources/_gen/assets/sass/main.scss_3ec8e0fa91f2f30b6b4b66f36c8c1e78.content +++ /dev/null @@ -1 +0,0 @@ -@font-face{font-display:swap;font-family:roboto;font-style:normal;font-weight:400;src:url(fonts/Roboto/roboto-v30-latin-regular.eot);src:url(fonts/Roboto/roboto-v30-latin-regular.eot?#iefix)format("embedded-opentype"),url(fonts/Roboto/roboto-v30-latin-regular.woff2)format("woff2"),url(fonts/Roboto/roboto-v30-latin-regular.woff)format("woff"),url(fonts/Roboto/roboto-v30-latin-regular.ttf)format("truetype"),url(fonts/Roboto/roboto-v30-latin-regular.svg#Roboto)format("svg")}*{-webkit-transition:background-color 75ms ease-in,border-color 75ms ease-in;-moz-transition:background-color 75ms ease-in,border-color 75ms ease-in;-ms-transition:background-color 75ms ease-in,border-color 75ms ease-in;-o-transition:background-color 75ms ease-in,border-color 75ms ease-in;transition:background-color 75ms ease-in,border-color 75ms ease-in}.notransition{-webkit-transition:none;-moz-transition:none;-ms-transition:none;-o-transition:none;transition:none}html{overflow-x:hidden;width:100%}body,h1,h2,h3,h4,h5,h6,p,blockquote,pre,hr,dl,dd,ol,ul,figure{margin:0;padding:0}body{min-height:100vh;overflow-x:hidden;position:relative;color:#434648;background-color:#fff;font:16px/1.85 Roboto,sans-serif;-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased;-webkit-font-feature-settings:"kern" 1;-moz-font-feature-settings:"kern" 1;-o-font-feature-settings:"kern" 1;font-feature-settings:"kern" 1;font-kerning:normal;box-sizing:border-box}h1,h2,h3,h4,h5,h6,p,blockquote,pre,ul,ol,dl,figure{margin-top:10px;margin-bottom:10px}strong,b{font-weight:700;color:#0d122b}hr{border-bottom:0;border-style:solid;border-color:#ececec}img{max-width:100%;vertical-align:middle;-webkit-user-drag:none;margin:0 auto;text-align:center}figure{position:relative}figure>img{display:block;position:relative}figcaption{font-size:13px;text-align:center}ul li{display:list-item;text-align:-webkit-match-parent}ol li{position:relative}ul,ol{margin-top:0;margin-left:30px}li{padding-bottom:1px;padding-top:1px}li:before{color:#0d122b}li>ul,li>ol{margin-bottom:2px;margin-top:0}h1,h2,h3,h4,h5,h6{color:#0d122b;font-weight:700}h1+ul,h1+ol,h2+ul,h2+ol,h3+ul,h3+ol,h4+ul,h4+ol,h5+ul,h5+ol,h6+ul,h6+ol{margin-top:10px}@media screen and (max-width:768px){h1,h2,h3,h4,h5,h6{scroll-margin-top:65px}}h1>a,h2>a,h3>a,h4>a,h5>a,h6>a{text-decoration:none;border:none}h1>a:hover,h2>a:hover,h3>a:hover,h4>a:hover,h5>a:hover,h6>a:hover{text-decoration:none;border:none}a{color:inherit;text-decoration-color:#d2c7c7}a:hover{color:#003fff}a:focus{outline:3px solid rgba(0,54,199,.6);outline-offset:2px}del{color:inherit}em{color:inherit}blockquote{color:#525b66;opacity:.9;border-left:5px solid #c4c8cc;padding:0 0 0 1rem;margin-left:.3rem;margin-right:.3rem;font-size:1em}blockquote>:last-child{margin-bottom:0;margin-top:0}.wrapper{max-width:-webkit-calc(720px - (30px * 2));max-width:calc(720px - (30px * 2));position:relative;margin-right:auto;margin-left:auto;padding-right:30px;padding-left:30px}@media screen and (max-width:768px){.wrapper{max-width:-webkit-calc(720px - (30px));max-width:calc(720px - (30px));padding-right:20px;padding-left:20px}.wrapper.blurry{animation:.2s ease-in forwards blur;-webkit-animation:.2s ease-in forwards blur}}u{text-decoration-color:#d2c7c7}small{font-size:14px}sup{border-radius:10%;top:-3px;left:2px;font-size:small;position:relative;margin-right:2px}.overflow-table{overflow-x:auto}table{width:100%;margin-top:15px;border-collapse:collapse;font-size:14px}table thead{font-weight:700;color:#0d122b;border-bottom:1px solid #ececec}table th,table td,table tr{border:1px solid #ececec;padding:2px 7px}.navbar:after,.wrapper:after{content:"";display:table;clear:both}mark,::selection{background:#fffba0;color:#0d122b}.gist table{border:0}.gist table tr,.gist table td{border:0}.navbar{height:auto;max-width:calc(890px - (30px * 2));max-width:-webkit-calc(890px - (30px * 2));position:relative;margin-right:auto;margin-left:auto;border-bottom:1px solid #ececec;padding:.5rem .3rem}.logo{float:left;margin:.5rem 0 0 1rem}.logo>svg{opacity:.7}.logo:hover>svg{opacity:1}@media screen and (max-width:768px){.logo{padding-top:.3rem}}.menu{user-select:none;-ms-user-select:none;-webkit-user-select:none}.menu ul{margin:0}.menu .menu-separator{margin-right:.7rem}@media screen and (max-width:768px){.menu .menu-separator{display:none}}.menu a#mode{-webkit-transform:scale(1,1);transform:scale(1,1);opacity:.7;z-index:1}.menu a#mode:hover{cursor:pointer;opacity:1}.menu a#mode:active{-webkit-transform:scale(.9,.9);transform:scale(.9,.9)}.menu a#mode .mode-moon{display:block}.menu a#mode .mode-moon line{stroke:#0d122b;fill:none}.menu a#mode .mode-moon circle{fill:#0d122b;stroke:#0d122b}.menu a#mode .mode-sunny{display:none}.menu a#mode .mode-sunny line{stroke:#eaeaea;fill:none}.menu a#mode .mode-sunny circle{fill:none;stroke:#eaeaea}.menu .trigger{float:right;display:flex;align-items:center}.menu .menu-trigger{display:none}.menu .menu-icon{display:none}.menu li{display:inline-block;margin:0;padding:0;list-style:none}@media screen and (max-width:768px){.menu li{display:block;margin:0;padding:0;list-style:none}}.menu .menu-link{color:#0d122b;line-height:2.25;text-decoration:none;padding:.3rem .5rem;opacity:.7;letter-spacing:.015rem}.menu .menu-link:hover{opacity:1}.menu .menu-link:not(:last-child){margin-right:5px}@media screen and (max-width:768px){.menu .menu-link{opacity:.8}}.menu .menu-link.active{opacity:1;font-weight:600}@media screen and (max-width:768px){.menu{position:fixed;top:0;left:0;right:0;z-index:2;text-align:center;height:50px;background-color:#fff;border-bottom:1px solid #ececec}.menu a#mode{left:10px;top:12px}.menu .menu-icon{display:block;position:absolute;right:0;margin:.7rem .3rem 0 0;cursor:pointer;text-align:center;z-index:1}.menu .menu-icon>svg{opacity:.7}.menu .menu-icon:hover>svg{opacity:1}.menu .menu-icon:active{-webkit-transform:scale(.9,.9);transform:scale(.9,.9)}.menu input[type=checkbox]:not(:checked)~.trigger{clear:both;visibility:hidden}.menu input[type=checkbox]:checked~.trigger{position:fixed;animation:.2s ease-in forwards fadein;-webkit-animation:.2s ease-in forwards fadein;flex-direction:column;justify-content:center;height:100vh;width:100%;top:0}.menu .menu-link{display:block;box-sizing:border-box;font-size:1.1em}.menu .menu-link:not(:last-child){margin:0;padding:2px 0}}.author{margin-top:6.3rem;margin-bottom:7.2rem;text-align:center}@media screen and (max-width:768px){.author{margin-bottom:3em}}.author .author-avatar{width:70px;height:70px;border-radius:100%;user-select:none;-ms-user-select:none;-webkit-user-select:none;-webkit-animation:.5s ease-in forwards fadein;animation:.5s ease-in forwards fadein;opacity:1;object-fit:cover}.author .author-name{font-size:1.7em;margin-bottom:2px}.author .author-bio{margin:0 auto;opacity:.9;max-width:393px;line-height:1.688}.posts-item-note{padding-bottom:.3rem;font-weight:500;color:#0d122b}.post-item{display:flex;padding-top:5px;padding-bottom:6px;justify-content:space-between;flex-direction:row;align-items:center}.post-item:not(:first-child){border-top:1px solid #ececec}.post-item .post-item-date{min-width:96px;color:#0d122b}@media screen and (max-width:768px){.post-item .post-item-date{font-size:16px}}.post-item .post-item-title{margin:0;border:0;padding:0;font-size:16px;font-weight:400;letter-spacing:.1px}@media screen and (max-width:768px){.post-item .post-item-title{max-width:15rem}}.post-item .post-item-title a{color:#434648;transition:all 150ms ease-in 0s}.post-item .post-item-title a:hover,.post-item .post-item-title afocus{color:#0d122b}.footer{margin-top:8em;margin-bottom:2em;text-align:center}@media screen and (max-width:768px){.footer{margin-top:3em}}.footer span.footer_item{opacity:.8;font-weight:700;font-size:14px}.footer a.footer_item{opacity:.8;text-decoration:none}.footer a.footer_item:not(:last-child){margin-right:10px}.footer a.footer_item:not(:last-child):hover{opacity:1}.footer_copyright{font-size:13px;display:block;color:#6b7886;opacity:.8;margin-top:.7rem;padding:.3rem .95rem}.footer_social-icons a{text-decoration:none;margin-right:.31rem}.footer_social-icons svg{color:#888a90;height:24px;width:24px}.footer_social-icons svg:hover{color:#ddd}.not-found{text-align:center;display:flex;justify-content:center;flex-direction:column;height:75vh}.not-found .title{font-size:5em;font-weight:700;line-height:1.1;color:#0d122b;text-shadow:1px 0 0 #003fff}.not-found .phrase{color:#434648}.not-found .solution{color:#003fff;letter-spacing:.5px}.not-found .solution:hover{color:#0036c7}.search-article{position:relative;margin-bottom:50px}.search-article label[for=search-input]{position:relative;top:10px;left:11px}.search-article input[type=search]{top:0;left:0;border:0;width:100%;height:40px;outline:none;position:absolute;border-radius:5px;padding:10px 10px 10px 35px;color:#434648;-webkit-appearance:none;font-size:16px;background-color:rgba(128,128,128,.1);border:1px solid rgba(128,128,128,.1)}.search-article input[type=search]::-webkit-input-placeholder{color:gray}.search-article input[type=search]::-webkit-search-decoration,.search-article input[type=search]::-webkit-search-results-decoration{display:none}#search-results{text-align:center}#search-results li{text-align:left}.archive-tags{height:auto}.archive-tags .tag-item{padding:1px 3px;border-radius:2px;border:1px solid rgba(128,128,128,.1);background-color:rgba(128,128,128,.1)}sub,sup{font-size:79%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}kbd{font-size:85%;border-radius:3px;color:#333638;background:#d8dbe2;display:inline-block;font-family:Consolas,monaco,monospace;line-height:1;padding:2px 4px;white-space:nowrap}mark{background:#ff0;color:#000;border-radius:3px}@media screen and (max-width:768px){.wrapper.post{padding-left:15px;padding-right:15px}}.header{margin-top:7.8em}.header .header-title{font-size:2em;line-height:1.2;margin-top:10px;margin-bottom:20px}.header .header-title.center{text-align:center}@media screen and (max-width:768px){.header .header-title{font-size:1.9em}}.post-meta{padding-top:3px;line-height:1.3;color:#6b7886}.post-meta time{position:relative;margin-right:1.5em}.post-meta span[itemprop=author]{border-bottom:1px dotted #ececec}.page-content{padding-top:8px}.page-content iframe{text-align:center}.page-content figure img{border-radius:2px}.page-content figure figcaption{margin-top:5px;font-style:italic;font-size:14px}.page-content a{color:#003fff;text-decoration:none}.page-content a[target=_blank]::after{content:" \2197";font-size:14px;line-height:0;position:relative;bottom:5px;vertical-align:baseline}.page-content a:hover{color:#0036c7}.page-content a:focus{color:#003fff}.page-content>p{margin:0;padding-top:15px;padding-bottom:15px}.page-content ul.task-list{list-style:none;margin:0}.page-content ul.task-list li::before{content:""}.page-content ul.task-list li input[type=checkbox]{margin-right:10px}.page-content dl dt{font-weight:700}.page-content h1,.page-content h2,.page-content h3,.page-content h4,.page-content h5,.page-content h6{color:#0d122b;font-weight:700;margin-top:30px;margin-bottom:0;letter-spacing:.03rem}.page-content h1:hover .anchor-head,.page-content h2:hover .anchor-head,.page-content h3:hover .anchor-head,.page-content h4:hover .anchor-head,.page-content h5:hover .anchor-head,.page-content h6:hover .anchor-head{color:#003fff;opacity:1}.page-content h1 .anchor-head,.page-content h2 .anchor-head,.page-content h3 .anchor-head,.page-content h4 .anchor-head,.page-content h5 .anchor-head,.page-content h6 .anchor-head{position:relative;opacity:0;outline:none}.page-content h1 .anchor-head::before,.page-content h2 .anchor-head::before,.page-content h3 .anchor-head::before,.page-content h4 .anchor-head::before,.page-content h5 .anchor-head::before,.page-content h6 .anchor-head::before{content:"#";position:absolute;right:-3px;width:1em;font-weight:700}.page-content h1{font-size:24px}.page-content h2{font-size:22px}.page-content h3{font-size:20px}.page-content h4{font-size:20px}.page-content h5{font-size:16px}.page-content h6{font-size:14px}.post-nav{display:flex;position:relative;margin-top:5em;border-top:1px solid #ececec;line-height:1.4}.post-nav .post-nav-item{border-bottom:0;font-weight:700;padding-bottom:10px;width:50%;padding-top:10px;text-decoration:none;box-sizing:border-box}.post-nav .post-nav-item .post-title{color:#0d122b}.post-nav .post-nav-item:hover .post-title,.post-nav .post-nav-item:focus .post-title{color:#0036c7;opacity:.9}.post-nav .post-nav-item .nav-arrow{font-weight:400;font-size:14px;color:#6b7886;margin-bottom:3px}.post-nav .post-nav-item:nth-child(odd){padding-left:0;padding-right:20px}.post-nav .post-nav-item:nth-child(even){text-align:right;padding-right:0;padding-left:20px}@media screen and (max-width:768px){.post-nav{display:block;font-size:14px}.post-nav .post-nav-item{display:block;width:100%}.post-nav .post-nav-item:nth-child(even){border-left:0;padding-left:0;border-top:1px solid #ececec}}.post-updated-at{font-family:ubuntu mono,monospace}code{font-family:Consolas,monospace;text-rendering:optimizeLegibility;font-feature-settings:"calt" 1;font-variant-ligatures:normal;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;font-size:inherit}li>code,p>code{white-space:pre-wrap;font-size:.9em;padding:1px 3px;position:relative;top:-1px;color:#333638;background-color:#d8dbe2;border-radius:2px;border:1px solid rgba(128,128,128,.1)}pre{background-color:#1a1b21;border-radius:.3rem;padding:.5rem 1rem;display:block;overflow-x:auto}@media screen and (max-width:768px){pre{margin:0 calc(51% - 51vw)}}pre::-webkit-scrollbar{height:.5rem}pre::-webkit-scrollbar-track{background:#606071;border-radius:.1rem}pre::-webkit-scrollbar-thumb{background:#999ea2;border-radius:.3rem}pre::-webkit-scrollbar-thumb:hover{background:#424546}pre>code{color:#fff;max-width:50rem;margin-left:auto;margin-right:auto;line-height:1.5;display:block;border:0}.highlight table td{padding:5px}.highlight table pre{margin:0}.highlight,.highlight .w{color:#fbf1c7}.highlight .err{color:#fb4934;font-weight:700}.highlight .c,.highlight .cd,.highlight .cm,.highlight .c1,.highlight .cs{color:#928374;font-style:italic}.highlight .cp{color:#8ec07c}.highlight .nt{color:#fb4934}.highlight .o,.highlight .ow{color:#fbf1c7}.highlight .p,.highlight .pi{color:#fbf1c7}.highlight .gi{color:#b8bb26;background-color:#282828}.highlight .gd{color:#fb4934;background-color:#282828}.highlight .gh{color:#b8bb26;font-weight:700}.highlight .k,.highlight .kn,.highlight .kp,.highlight .kr,.highlight .kv{color:#fb4934}.highlight .kc{color:#d3869b}.highlight .kt{color:#fabd2f}.highlight .kd{color:#fe8019}.highlight .s,.highlight .sb,.highlight .sc,.highlight .sd,.highlight .s2,.highlight .sh,.highlight .sx,.highlight .s1{color:#b8bb26;font-style:italic}.highlight .si{color:#b8bb26;font-style:italic}.highlight .sr{color:#b8bb26;font-style:italic}.highlight .se{color:#fe8019}.highlight .nn{color:#8ec07c}.highlight .nc{color:#8ec07c}.highlight .no{color:#d3869b}.highlight .na{color:#b8bb26}.highlight .m,.highlight .mf,.highlight .mh,.highlight .mi,.highlight .il,.highlight .mo,.highlight .mb,.highlight .mx{color:#d3869b}.highlight .ss{color:#83a598}details{cursor:pointer}.toc{margin:1.1rem 0 1rem;padding:.5rem 1rem;border-radius:.3rem;background-color:#edecec}.toc ul{padding-top:1rem;margin-left:1rem;padding-left:1rem}.toc ul li{margin-bottom:.5em;line-height:1.4}@keyframes fadein{0%{opacity:.2}100%{opacity:1}}@keyframes blur{0%{filter:blur(0)}100%{filter:blur(4px)}}.embed-responsive{height:0;max-width:100%;overflow:hidden;position:relative;padding-bottom:56.25%;margin-top:20px}.embed-responsive iframe,.embed-responsive object,.embed-responsive embed{top:0;left:0;width:100%;height:100%;position:absolute}.main-404{padding:9rem 0;text-align:center}@media(prefers-color-scheme:dark){html:not(.light) body{color:#babdc4;background-color:#131418}html:not(.light) h1,html:not(.light) h2,html:not(.light) h3,html:not(.light) h4,html:not(.light) h5,html:not(.light) h6{color:#eaeaea}html:not(.light) table thead{color:#eaeaea;border-color:#1b1d25}html:not(.light) table th,html:not(.light) table td,html:not(.light) table tr{border-color:#1b1d25}html:not(.light) .page-content a{color:#77a8fd}html:not(.light) .page-content a:hover,html:not(.light) .page-content a:active,html:not(.light) .page-content a:focus{color:#5292ff}html:not(.light) .page-content h3{border-color:#1b1d25}html:not(.light) .page-content h1 .anchor-head,html:not(.light) .page-content h2 .anchor-head,html:not(.light) .page-content h3 .anchor-head,html:not(.light) .page-content h4 .anchor-head,html:not(.light) .page-content h5 .anchor-head,html:not(.light) .page-content h6 .anchor-head{color:#77a8fd}html:not(.light) .toc{background-color:#323232}html:not(.light) #totop{color:#babdc4;background-color:#676767b3}html:not(.light) #totop:hover{background-color:#676767}html:not(.light) li>code,html:not(.light) p>code{font-size:.9em;padding:1px 3px;position:relative;top:-1px;color:#c2c4ca;background-color:#2d2d2d;border-radius:2px;border:1px solid rgba(128,128,128,.1)}html:not(.light) kbd{color:#c2c4ca;background-color:#2d2d2d}html:not(.light) hr{border-color:#1b1d25}html:not(.light) .post-meta{color:#767f87}html:not(.light) .post-meta time::after{background-color:#1b1d25}html:not(.light) .post-meta span[itemprop=author]{border-color:#1b1d25}html:not(.light) a{color:inherit;text-decoration-color:#4a4d56}html:not(.light) a:hover{color:#77a8fd}html:not(.light) a:focus{outline-color:rgba(44,118,246,.6)}html:not(.light) li:before{color:#eaeaea}html:not(.light) blockquote{color:#9b9ba3;border-color:#4a4d56}html:not(.light) strong,html:not(.light) b{color:#eaeaea}html:not(.light) .navbar{border-color:#1b1d25}html:not(.light) .navbar .menu a#mode .mode-sunny{display:block}html:not(.light) .navbar .menu a#mode .mode-moon{display:none}html:not(.light) .navbar .menu .menu-link{color:#eaeaea}}@media screen and (prefers-color-scheme:dark) and (max-width:768px){html:not(.light) .navbar .menu{background-color:#131418;border-color:#1b1d25}html:not(.light) .navbar .menu input[type=checkbox]:checked~.trigger{background:#131418}}@media(prefers-color-scheme:dark){html:not(.light) .post-item:not(:first-child){border-color:#1b1d25}html:not(.light) .post-item .post-item-date{color:#eaeaea}html:not(.light) .post-item .post-item-title a{color:#babdc4}html:not(.light) .post-item .post-item-title a:hover,html:not(.light) .post-item .post-item-title afocus{color:#eaeaea}html:not(.light) .post-nav{border-color:#1b1d25}html:not(.light) .post-nav .post-nav-item{font-weight:700}html:not(.light) .post-nav .post-nav-item .post-title{color:#eaeaea;opacity:.9}html:not(.light) .post-nav .post-nav-item:hover .post-title,html:not(.light) .post-nav .post-nav-item:focus .post-title{color:#5292ff}html:not(.light) .post-nav .post-nav-item .nav-arrow{color:#767f87}}@media screen and (prefers-color-scheme:dark) and (max-width:768px){html:not(.light) .post-nav .post-nav-item:nth-child(even){border-color:#1b1d25}}@media(prefers-color-scheme:dark){html:not(.light) .footer span.footer_item{color:#eaeaea}html:not(.light) .footer a.footer_item:not(:last-child){color:#eaeaea}html:not(.light) .footer .footer_copyright{color:#767f87;opacity:1}html:not(.light) .not-found .title{color:#eaeaea;text-shadow:1px 0 0 #77a8fd}html:not(.light) .not-found .phrase{color:#babdc4}html:not(.light) .not-found .solution{color:#77a8fd}html:not(.light) .not-found .solution:hover{color:#5292ff}html:not(.light) .search-article input[type=search]{color:#babdc4}html:not(.light) .search-article input[type=search]::-webkit-input-placeholder{color:rgba(128,128,128,.8)}}html.dark body{color:#babdc4;background-color:#131418}html.dark h1,html.dark h2,html.dark h3,html.dark h4,html.dark h5,html.dark h6{color:#eaeaea}html.dark table thead{color:#eaeaea;border-color:#1b1d25}html.dark table th,html.dark table td,html.dark table tr{border-color:#1b1d25}html.dark .page-content a{color:#77a8fd}html.dark .page-content a:hover,html.dark .page-content a:active,html.dark .page-content a:focus{color:#5292ff}html.dark .page-content h3{border-color:#1b1d25}html.dark .page-content h1 .anchor-head,html.dark .page-content h2 .anchor-head,html.dark .page-content h3 .anchor-head,html.dark .page-content h4 .anchor-head,html.dark .page-content h5 .anchor-head,html.dark .page-content h6 .anchor-head{color:#77a8fd}html.dark .toc{background-color:#323232}html.dark #totop{color:#babdc4;background-color:#676767b3}html.dark #totop:hover{background-color:#676767}html.dark li>code,html.dark p>code{font-size:.9em;padding:1px 3px;position:relative;top:-1px;color:#c2c4ca;background-color:#2d2d2d;border-radius:2px;border:1px solid rgba(128,128,128,.1)}html.dark kbd{color:#c2c4ca;background-color:#2d2d2d}html.dark hr{border-color:#1b1d25}html.dark .post-meta{color:#767f87}html.dark .post-meta time::after{background-color:#1b1d25}html.dark .post-meta span[itemprop=author]{border-color:#1b1d25}html.dark a{color:inherit;text-decoration-color:#4a4d56}html.dark a:hover{color:#77a8fd}html.dark a:focus{outline-color:rgba(44,118,246,.6)}html.dark li:before{color:#eaeaea}html.dark blockquote{color:#9b9ba3;border-color:#4a4d56}html.dark strong,html.dark b{color:#eaeaea}html.dark .navbar{border-color:#1b1d25}html.dark .navbar .menu a#mode .mode-sunny{display:block}html.dark .navbar .menu a#mode .mode-moon{display:none}html.dark .navbar .menu .menu-link{color:#eaeaea}@media screen and (max-width:768px){html.dark .navbar .menu{background-color:#131418;border-color:#1b1d25}html.dark .navbar .menu input[type=checkbox]:checked~.trigger{background:#131418}}html.dark .post-item:not(:first-child){border-color:#1b1d25}html.dark .post-item .post-item-date{color:#eaeaea}html.dark .post-item .post-item-title a{color:#babdc4}html.dark .post-item .post-item-title a:hover,html.dark .post-item .post-item-title afocus{color:#eaeaea}html.dark .post-nav{border-color:#1b1d25}html.dark .post-nav .post-nav-item{font-weight:700}html.dark .post-nav .post-nav-item .post-title{color:#eaeaea;opacity:.9}html.dark .post-nav .post-nav-item:hover .post-title,html.dark .post-nav .post-nav-item:focus .post-title{color:#5292ff}html.dark .post-nav .post-nav-item .nav-arrow{color:#767f87}@media screen and (max-width:768px){html.dark .post-nav .post-nav-item:nth-child(even){border-color:#1b1d25}}html.dark .footer span.footer_item{color:#eaeaea}html.dark .footer a.footer_item:not(:last-child){color:#eaeaea}html.dark .footer .footer_copyright{color:#767f87;opacity:1}html.dark .not-found .title{color:#eaeaea;text-shadow:1px 0 0 #77a8fd}html.dark .not-found .phrase{color:#babdc4}html.dark .not-found .solution{color:#77a8fd}html.dark .not-found .solution:hover{color:#5292ff}html.dark .search-article input[type=search]{color:#babdc4}html.dark .search-article input[type=search]::-webkit-input-placeholder{color:rgba(128,128,128,.8)}.list-page .post-year{padding-bottom:.5rem}.icon-star{color:orange;height:16px;margin-right:1rem;width:16px;display:block}.post-item-right{margin-left:auto;margin-right:0} \ No newline at end of file diff --git a/resources/_gen/assets/sass/main.scss_3ec8e0fa91f2f30b6b4b66f36c8c1e78.json b/resources/_gen/assets/sass/main.scss_3ec8e0fa91f2f30b6b4b66f36c8c1e78.json deleted file mode 100644 index 1a8af07f65b..00000000000 --- a/resources/_gen/assets/sass/main.scss_3ec8e0fa91f2f30b6b4b66f36c8c1e78.json +++ /dev/null @@ -1 +0,0 @@ -{"Target":"style.min.e390ba7da26222f4dc42a349955d76dbbe44e5ce2535a43de5a70633a0a9ec3c.css","MediaType":"text/css","Data":{"Integrity":"sha256-45C6faJiIvTcQqNJlV12275E5c4lNaQ95acGM6Cp7Dw="}} \ No newline at end of file diff --git a/run-tests.sh b/run-tests.sh new file mode 100644 index 00000000000..737ced4cc2c --- /dev/null +++ b/run-tests.sh @@ -0,0 +1,36 @@ +#!/bin/bash + +echo "┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓" +echo "┃ .-----.-----.----.--| |.--.--. ┃" +echo "┃ | | -__| _| _ || | | ┃" +echo "┃ |__|__|_____|__| |_____||___ | ┃" +echo "┃ |_____| ┃" +echo "┃ .--| |.---.-.--.--.| |_.----.|__|.-----.-----. ┃" +echo "┃ | _ || _ | | || _| _|| || _ |__ --| ┃" +echo "┃ |_____||___._|___ ||____|__| |__|| __|_____| ┃" +echo "┃ |_____| |__| ┃" +echo "┣━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┫" +echo "┃ t̶e̶s̶t̶s̶?̶ s̶w̶e̶e̶t̶!̶ ┃" +echo "┃ test suite ┃" +echo "┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛" + +# make sure everything we need is installed +# that is: playwright, which is our test runner +npm install --quiet +# and headless chrome to run tests in +npx playwright install chromium-headless-shell + +# now run hugo server and trap exit to kill it when the test suite finishes +# we run hugo server so that the test suite is using a real webserver +# otherwise web browsers are super whiny about file:// urls +# we could just hugo build and then run a different web server +# but we've got hugo around, might as well use it +# We skip opengraph image building so that the test suite doesn't take ages +# and we render in memory so that we don't need to write to disk +# 61276 is the seating capacity of Anfield #YNWA +echo Building testing website in $TEMPD +HUGO_SKIP_OPENGRAPH=true hugo server --renderToMemory --port 61276 & +trap "trap - SIGTERM && kill -- -$$" SIGINT SIGTERM EXIT + +# finally, run the tests +npx playwright test diff --git a/tests/basics.spec.js b/tests/basics.spec.js new file mode 100644 index 00000000000..915a79e06e7 --- /dev/null +++ b/tests/basics.spec.js @@ -0,0 +1,19 @@ +// @ts-check +import { test, expect } from '@playwright/test'; + +test('has title', async ({ page }) => { + await page.goto('http://localhost:61276/'); + + // Expect a title "to contain" a substring. + await expect(page).toHaveTitle(/Nerdy Day Trips/); +}); + +test('about link', async ({ page }) => { + await page.goto('http://localhost:61276/'); + + // Click the get started link. + await page.getByRole('link', { name: 'About' }).click(); + + // Expects page to have an About heading. + await expect(page.locator("#post-header").getByRole('heading', { name: 'About Nerdy Day Trips' })).toBeVisible(); +}); diff --git a/themes/ndt2/layouts/partials/opengraph.html b/themes/ndt2/layouts/partials/opengraph.html index 80dfe57bd73..d8eda866e9a 100644 --- a/themes/ndt2/layouts/partials/opengraph.html +++ b/themes/ndt2/layouts/partials/opengraph.html @@ -24,6 +24,8 @@ {{ $img := resources.Get "images/og.png" }} {{ if not $img }} {{ warnf "OG base image not found!" }} + {{ else if getenv "HUGO_SKIP_OPENGRAPH" }} + {{ warnf "Skipping opengraph image gen because HUGO_SKIP_OPENGRAPH is set" }} {{ else }} {{ $boldFont := resources.Get "fonts/Ubuntu-B.ttf"}} {{ $mediumFont := resources.Get "fonts/Ubuntu-R.ttf"}}