37 lines
1.3 KiB
JavaScript
37 lines
1.3 KiB
JavaScript
|
|
// examples/failing-test.js
|
||
|
|
// Example of a failing layout assertion and the diagnostic information
|
||
|
|
// you can extract from the failure.
|
||
|
|
//
|
||
|
|
// In V1.0, failures are surfaced through standard Playwright assertions.
|
||
|
|
// The extracted geometry gives you raw measured values for debugging.
|
||
|
|
|
||
|
|
const { test, expect } = require('@playwright/test')
|
||
|
|
const { imhotep } = require('imhotep-playwright')
|
||
|
|
|
||
|
|
test('failing gap assertion shows diagnostics', async ({ page }) => {
|
||
|
|
await page.goto('https://example.com')
|
||
|
|
const ui = await imhotep(page)
|
||
|
|
|
||
|
|
const leftData = await ui.extract('.left-box')
|
||
|
|
const rightData = await ui.extract('.right-box')
|
||
|
|
|
||
|
|
expect(leftData.length).toBeGreaterThanOrEqual(1)
|
||
|
|
expect(rightData.length).toBeGreaterThanOrEqual(1)
|
||
|
|
|
||
|
|
const left = leftData[0].rect
|
||
|
|
const right = rightData[0].rect
|
||
|
|
|
||
|
|
// Calculate the actual gap between the two boxes
|
||
|
|
const actualGap = right.x - (left.x + left.width)
|
||
|
|
|
||
|
|
console.log('Diagnostic output:')
|
||
|
|
console.log(` Left box: x=${left.x}, width=${left.width}`)
|
||
|
|
console.log(` Right box: x=${right.x}, width=${right.width}`)
|
||
|
|
console.log(` Actual gap: ${actualGap}px`)
|
||
|
|
console.log(` Required: at least 16px`)
|
||
|
|
|
||
|
|
// This assertion will fail if the gap is too small.
|
||
|
|
// The console output above gives you the exact measured values.
|
||
|
|
expect(actualGap).toBeGreaterThanOrEqual(16)
|
||
|
|
})
|