40 lines
1.4 KiB
JavaScript
40 lines
1.4 KiB
JavaScript
|
// examples/page-test.js
|
||
|
|
// Simple page layout test using Imhotep extraction and Playwright assertions.
|
||
|
|
//
|
||
|
|
// This is the primary working pattern in V1.0: use ui.extract() to get
|
||
|
|
// element geometry, then assert with Playwright's expect().
|
||
|
|
|
||
|
|
const { test, expect } = require('@playwright/test')
|
||
|
|
const { imhotep } = require('imhotep-playwright')
|
||
|
|
|
||
|
|
test('page layout relations', async ({ page }) => {
|
||
|
|
// Navigate to a page with a known layout
|
||
|
|
await page.goto('https://example.com')
|
||
|
|
|
||
|
|
// Attach Imhotep to the page
|
||
|
|
const ui = await imhotep(page)
|
||
|
|
|
||
|
|
// Extract geometry for the elements we want to verify
|
||
|
|
const headerData = await ui.extract('header')
|
||
|
|
const navData = await ui.extract('nav')
|
||
|
|
const mainData = await ui.extract('main')
|
||
|
|
|
||
|
|
// All selectors should resolve to at least one element
|
||
|
|
expect(headerData.length).toBeGreaterThanOrEqual(1)
|
||
|
|
expect(navData.length).toBeGreaterThanOrEqual(1)
|
||
|
|
expect(mainData.length).toBeGreaterThanOrEqual(1)
|
||
|
|
|
||
|
|
const header = headerData[0].rect
|
||
|
|
const nav = navData[0].rect
|
||
|
|
const main = mainData[0].rect
|
||
|
|
|
||
|
|
// Layout law: nav should be below header with at least 8px gap
|
||
|
|
expect(nav.y).toBeGreaterThanOrEqual(header.y + header.height + 8)
|
||
|
|
|
||
|
|
// Layout law: main should be below nav
|
||
|
|
expect(main.y).toBeGreaterThanOrEqual(nav.y + nav.height)
|
||
|
|
|
||
|
|
// Layout law: header should span full width
|
||
|
|
expect(header.width).toBeGreaterThanOrEqual(320)
|
||
|
|
})
|