diff --git a/docs/api.md b/docs/api.md index 136d6ecd51..e9bce7ba13 100644 --- a/docs/api.md +++ b/docs/api.md @@ -254,7 +254,6 @@ * [elementHandle.$x(expression)](#elementhandlexexpression) * [elementHandle.asElement()](#elementhandleaselement) * [elementHandle.boundingBox()](#elementhandleboundingbox) - * [elementHandle.boxModel()](#elementhandleboxmodel) * [elementHandle.click([options])](#elementhandleclickoptions) * [elementHandle.contentFrame()](#elementhandlecontentframe) * [elementHandle.dblclick([options])](#elementhandledblclickoptions) @@ -3370,25 +3369,6 @@ The method evaluates the XPath expression relative to the elementHandle. If ther This method returns the bounding box of the element (relative to the main frame), or `null` if the element is not visible. -#### elementHandle.boxModel() -- returns: <[Promise]> - - content <[Array]<[Object]>> Content box. - - x <[number]> - - y <[number]> - - padding <[Array]<[Object]>> Padding box. - - x <[number]> - - y <[number]> - - border <[Array]<[Object]>> Border box. - - x <[number]> - - y <[number]> - - margin <[Array]<[Object]>> Margin box. - - x <[number]> - - y <[number]> - - width <[number]> Element's width. - - height <[number]> Element's height. - -This method returns boxes of the element, or `null` if the element is not visible. Boxes are represented as an array of points; each Point is an object `{x, y}`. Box points are sorted clock-wise. - #### elementHandle.click([options]) - `options` <[Object]> - `button` <"left"|"right"|"middle"> Defaults to `left`. diff --git a/src/chromium/JSHandle.ts b/src/chromium/JSHandle.ts index c8c18372ff..89a0341e2a 100644 --- a/src/chromium/JSHandle.ts +++ b/src/chromium/JSHandle.ts @@ -412,23 +412,6 @@ export class ElementHandle extends JSHandle { return {x, y, width, height}; } - async boxModel(): Promise { - const result = await this._getBoxModel(); - - if (!result) - return null; - - const {content, padding, border, margin, width, height} = result.model; - return { - content: this._fromProtocolQuad(content), - padding: this._fromProtocolQuad(padding), - border: this._fromProtocolQuad(border), - margin: this._fromProtocolQuad(margin), - width, - height - }; - } - async screenshot(options: any = {}): Promise { let needsViewportReset = false; @@ -567,12 +550,3 @@ function computeQuadArea(quad) { } return Math.abs(area); } - -type BoxModel = { - content: {x: number, y: number}[], - padding: {x: number, y: number}[], - border: {x: number, y: number}[], - margin: {x: number, y: number}[], - width: number, - height : number -}; diff --git a/src/webkit/JSHandle.ts b/src/webkit/JSHandle.ts index 0caf02a86a..50379f5ebe 100644 --- a/src/webkit/JSHandle.ts +++ b/src/webkit/JSHandle.ts @@ -366,12 +366,3 @@ function computeQuadArea(quad) { } return Math.abs(area); } - -type BoxModel = { - content: {x: number, y: number}[], - padding: {x: number, y: number}[], - border: {x: number, y: number}[], - margin: {x: number, y: number}[], - width: number, - height : number -}; diff --git a/test/elementhandle.spec.js b/test/elementhandle.spec.js index feff82e641..2899739cdd 100644 --- a/test/elementhandle.spec.js +++ b/test/elementhandle.spec.js @@ -69,69 +69,6 @@ module.exports.addTests = function({testRunner, expect, FFOX, CHROME, WEBKIT}) { }); }); - describe.skip(FFOX || WEBKIT)('ElementHandle.boxModel', function() { - it('should work', async({page, server}) => { - await page.goto(server.PREFIX + '/resetcss.html'); - - // Step 1: Add Frame and position it absolutely. - await utils.attachFrame(page, 'frame1', server.PREFIX + '/resetcss.html'); - await page.evaluate(() => { - const frame = document.querySelector('#frame1'); - frame.style = ` - position: absolute; - left: 1px; - top: 2px; - `; - }); - - // Step 2: Add div and position it absolutely inside frame. - const frame = page.frames()[1]; - const divHandle = (await frame.evaluateHandle(() => { - const div = document.createElement('div'); - document.body.appendChild(div); - div.style = ` - box-sizing: border-box; - position: absolute; - border-left: 1px solid black; - padding-left: 2px; - margin-left: 3px; - left: 4px; - top: 5px; - width: 6px; - height: 7px; - `; - return div; - })).asElement(); - - // Step 3: query div's boxModel and assert box values. - const box = await divHandle.boxModel(); - expect(box.width).toBe(6); - expect(box.height).toBe(7); - expect(box.margin[0]).toEqual({ - x: 1 + 4, // frame.left + div.left - y: 2 + 5, - }); - expect(box.border[0]).toEqual({ - x: 1 + 4 + 3, // frame.left + div.left + div.margin-left - y: 2 + 5, - }); - expect(box.padding[0]).toEqual({ - x: 1 + 4 + 3 + 1, // frame.left + div.left + div.marginLeft + div.borderLeft - y: 2 + 5, - }); - expect(box.content[0]).toEqual({ - x: 1 + 4 + 3 + 1 + 2, // frame.left + div.left + div.marginLeft + div.borderLeft + dif.paddingLeft - y: 2 + 5, - }); - }); - - it('should return null for invisible elements', async({page, server}) => { - await page.setContent('
hi
'); - const element = await page.$('div'); - expect(await element.boxModel()).toBe(null); - }); - }); - describe.skip(WEBKIT)('ElementHandle.contentFrame', function() { it('should work', async({page,server}) => { await page.goto(server.EMPTY_PAGE);