Skip to content

Commit

Permalink
playwright interface correctness
Browse files Browse the repository at this point in the history
  • Loading branch information
ForsakenHarmony committed Jun 21, 2023
1 parent 87b1462 commit c71ace6
Showing 1 changed file with 29 additions and 40 deletions.
69 changes: 29 additions & 40 deletions test/lib/browsers/playwright.ts
Original file line number Diff line number Diff line change
@@ -28,6 +28,10 @@ export async function quit() {
browser = undefined
}

interface ElementHandleExt extends ElementHandle {
getComputedCss(prop: string): Promise<string>
}

export class Playwright extends BrowserInterface {
private activeTrace?: string
private eventCallbacks: Record<Event, Set<(...args: any[]) => void>> = {
@@ -192,8 +196,8 @@ export class Playwright extends BrowserInterface {
}

back(): BrowserInterface {
return this.chain(() => {
return page.goBack()
return this.chain(async () => {
await page.goBack()
})
}
forward(): BrowserInterface {
@@ -234,29 +238,21 @@ export class Playwright extends BrowserInterface {
return this.chain(() => page.bringToFront())
}

private wrapElement(el: ElementHandle, selector: string) {
;(el as any).selector = selector
;(el as any).text = () => el.innerText()
;(el as any).getComputedCss = (prop) =>
page.evaluate(
private wrapElement(el: ElementHandle, selector: string): ElementHandleExt {
function getComputedCss(prop: string) {
return page.evaluate(
function (args) {
return (
getComputedStyle(document.querySelector(args.selector))[
args.prop
] || null
)
const style = getComputedStyle(document.querySelector(args.selector))
return style[args.prop] || null
},
{ selector, prop }
)
;(el as any).getCssValue = (el as any).getComputedCss
;(el as any).getValue = () =>
page.evaluate(
function (args) {
return (document.querySelector(args.selector) as any).value
},
{ selector }
)
return el
}

return Object.assign(el, {
selector,
getComputedCss,
})
}

elementByCss(selector: string) {
@@ -268,64 +264,57 @@ export class Playwright extends BrowserInterface {
}

getValue() {
return this.chain((el) =>
page.evaluate(
function (args) {
return document.querySelector(args.selector).value
},
{ selector: el.selector }
)
) as any
return this.chain((el: ElementHandleExt) => el.inputValue())
}

text() {
return this.chain((el) => el.text()) as any
return this.chain((el: ElementHandleExt) => el.innerText())
}

type(text) {
return this.chain((el) => el.type(text))
return this.chain((el: ElementHandleExt) => el.type(text))
}

moveTo() {
return this.chain((el) => {
return page.hover(el.selector).then(() => el)
return this.chain((el: ElementHandleExt) => {
return el.hover().then(() => el)
})
}

async getComputedCss(prop: string) {
return this.chain((el) => {
return el.getCssValue(prop)
return this.chain((el: ElementHandleExt) => {
return el.getComputedCss(prop)
}) as any
}

async getAttribute<T = any>(attr) {
return this.chain((el) => el.getAttribute(attr)) as T
return this.chain((el: ElementHandleExt) => el.getAttribute(attr)) as T
}

hasElementByCssSelector(selector: string) {
return this.eval<boolean>(`!!document.querySelector('${selector}')`)
}

keydown(key: string): BrowserInterface {
return this.chain((el) => {
return this.chain((el: ElementHandleExt) => {
return page.keyboard.down(key).then(() => el)
})
}

keyup(key: string): BrowserInterface {
return this.chain((el) => {
return this.chain((el: ElementHandleExt) => {
return page.keyboard.up(key).then(() => el)
})
}

click() {
return this.chain((el) => {
return this.chain((el: ElementHandleExt) => {
return el.click().then(() => el)
})
}

touchStart() {
return this.chain((el: ElementHandle) => {
return this.chain((el: ElementHandleExt) => {
return el.dispatchEvent('touchstart').then(() => el)
})
}

0 comments on commit c71ace6

Please sign in to comment.