fix(e2e): assert the brand lockup and touch icon as they are actually built
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m2s
PR Checks / Backend Smoke (pull_request) Successful in 7s
PR Checks / Build Backend (no push) (pull_request) Successful in 11s
PR Checks / Build Frontend (no push) (pull_request) Successful in 48s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 11s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 21s
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m2s
PR Checks / Backend Smoke (pull_request) Successful in 7s
PR Checks / Build Backend (no push) (pull_request) Successful in 11s
PR Checks / Build Frontend (no push) (pull_request) Successful in 48s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 11s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 21s
The staging gate has been failing these two since the supplied logo artwork
replaced the reconstruction. Both tests were still asserting the previous
implementation, and both were right to fail — they were just describing
something the site no longer does.
the header carries the schoolcompare lockup
Looked for an <svg> inside the header link. The mark is raster now:
<picture><source><img src="/brand/mark.png">. Nothing matched, so the
locator timed out.
the brand asset set is complete and served
Requested /apple-icon, which 404s. The route moved when the generated
app/apple-icon.tsx became a static app/apple-icon.png — generated icons
serve at /apple-icon, static ones at /apple-icon.png with a content hash.
The icon was present and correctly linked the whole time.
Both now read from the page instead of hardcoding the shape of the answer: the
touch icon is fetched from its own <link rel="apple-touch-icon"> href, the way
this test already handles og:image, so it follows whatever Next emits.
The lockup assertion also got stronger rather than merely corrected. A
<picture> whose sources all 404 still lays out and still satisfies
toBeVisible(), so that alone would go green on a broken lockup; it now asserts
naturalWidth, which only a decoded image can satisfy.
Verified against staging directly: 41/41 pass.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
1 parent
7f4dfa2748
commit
e65688d600
1 file changed
+30
-4
@@ -789,9 +789,21 @@ test('the brand asset set is complete and served', async ({ page }) => {
|
||||
expect(og.ok()).toBe(true);
|
||||
expect(og.headers()['content-type']).toContain('image/png');
|
||||
|
||||
// iOS ignores SVG touch icons, so this must be a real raster.
|
||||
const apple = await page.request.get('/apple-icon');
|
||||
expect(apple.ok()).toBe(true);
|
||||
/*
|
||||
* iOS ignores SVG touch icons, so this must be a real raster.
|
||||
*
|
||||
* Read the href off the page rather than hardcoding a path. The route moved
|
||||
* when the generated app/apple-icon.tsx became a static app/apple-icon.png:
|
||||
* a generated icon is served at /apple-icon, a static one at /apple-icon.png
|
||||
* with a content hash. This test kept asking for /apple-icon and got a 404 —
|
||||
* reporting a missing icon while the icon was present and correctly linked.
|
||||
*/
|
||||
const appleLink = page.locator('link[rel="apple-touch-icon"]');
|
||||
await expect(appleLink).toHaveCount(1);
|
||||
const appleHref = await appleLink.getAttribute('href');
|
||||
expect(appleHref).toBeTruthy();
|
||||
const apple = await page.request.get(appleHref!);
|
||||
expect(apple.ok(), `apple touch icon at ${appleHref} should be served`).toBe(true);
|
||||
expect(apple.headers()['content-type']).toContain('image/png');
|
||||
|
||||
// Android needs a maskable PNG or the install prompt has no icon.
|
||||
@@ -912,8 +924,22 @@ test('the header carries the schoolcompare lockup', async ({ page }) => {
|
||||
// hashed at build time and change on any unrelated edit.
|
||||
await expect(home).toHaveText(/^\s*schoolcompare\s*$/);
|
||||
|
||||
const mark = home.locator('svg').first();
|
||||
/*
|
||||
* The mark is raster artwork, not an inline SVG — it has been since the
|
||||
* supplied logo replaced the reconstruction, and this locator went on
|
||||
* looking for an <svg> that no longer exists.
|
||||
*
|
||||
* Assert on naturalWidth rather than visibility: a <picture> whose sources
|
||||
* all 404 still lays out and still passes toBeVisible(), so the weaker
|
||||
* assertion would go green on a broken lockup.
|
||||
*/
|
||||
const mark = home.locator('img').first();
|
||||
await expect(mark).toBeVisible();
|
||||
const markState = await mark.evaluate((el: HTMLImageElement) => ({
|
||||
loaded: el.complete && el.naturalWidth > 0,
|
||||
src: el.currentSrc,
|
||||
}));
|
||||
expect(markState.loaded, `header mark failed to load: ${markState.src}`).toBe(true);
|
||||
});
|
||||
|
||||
test('no visible text falls back to the browser default black', async ({ page }) => {
|
||||
|
||||
Reference in new issue
Block a user