Skip to content

Commit

Permalink
[bidi][js] Add dom mutation handlers (#14238)
Browse files Browse the repository at this point in the history
Related to #13992.
  • Loading branch information
pujagani authored Jul 11, 2024
1 parent 785914e commit 0f68841
Show file tree
Hide file tree
Showing 7 changed files with 221 additions and 0 deletions.
10 changes: 10 additions & 0 deletions javascript/bidi-support/BUILD.bazel
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
package(default_visibility = [
"//dotnet/src/webdriver:__pkg__",
"//java/src/org/openqa/selenium/bidi:__pkg__",
"//java/src/org/openqa/selenium/remote:__pkg__",
"//javascript/node/selenium-webdriver:__pkg__",
])

exports_files([
"bidi-mutation-listener.js",
])
55 changes: 55 additions & 0 deletions javascript/bidi-support/bidi-mutation-listener.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,55 @@
// Licensed to the Software Freedom Conservancy (SFC) under one
// or more contributor license agreements. See the NOTICE file
// distributed with this work for additional information
// regarding copyright ownership. The SFC licenses this file
// to you under the Apache License, Version 2.0 (the
// "License"); you may not use this file except in compliance
// with the License. You may obtain a copy of the License at
//
// http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing,
// software distributed under the License is distributed on an
// "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
// KIND, either express or implied. See the License for the
// specific language governing permissions and limitations
// under the License.

function observeMutations(channel) {
const observer = new MutationObserver((mutations) => {
for (const mutation of mutations) {
switch (mutation.type) {
case 'attributes':
// Don't report our own attribute has changed.
if (mutation.attributeName === 'data-__webdriver_id') {
break
}
const curr = mutation.target.getAttribute(mutation.attributeName)
let id = mutation.target.dataset.__webdriver_id
if (!id) {
id = Math.random().toString(36).substring(2) + Date.now().toString(36)
mutation.target.dataset.__webdriver_id = id
}
const json = JSON.stringify({
target: id,
name: mutation.attributeName,
value: curr,
oldValue: mutation.oldValue,
})
channel(json)
break
default:
break
}
}
})

observer.observe(document, {
attributes: true,
attributeOldValue: true,
characterData: true,
characterDataOldValue: true,
childList: true,
subtree: true,
})
}
2 changes: 2 additions & 0 deletions javascript/node/selenium-webdriver/BUILD.bazel
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,7 @@ js_library(
"http/*.js",
"io/*.js",
"lib/*.js",
"lib/atoms/bidi-mutation-listener.js",
"net/*.js",
"remote/*.js",
"testing/*.js",
Expand All @@ -55,6 +56,7 @@ npm_package(
":manager-macos",
":manager-windows",
":prod-src-files",
"//javascript/node/selenium-webdriver/lib/atoms:bidi-mutation-listener",
"//javascript/node/selenium-webdriver/lib/atoms:find-elements",
"//javascript/node/selenium-webdriver/lib/atoms:get_attribute",
"//javascript/node/selenium-webdriver/lib/atoms:is_displayed",
Expand Down
7 changes: 7 additions & 0 deletions javascript/node/selenium-webdriver/lib/atoms/BUILD.bazel
Original file line number Diff line number Diff line change
Expand Up @@ -49,3 +49,10 @@ copy_file(
out = "mutation-listener.js",
visibility = ["//javascript/node/selenium-webdriver:__pkg__"],
)

copy_file(
name = "bidi-mutation-listener",
src = "//javascript/bidi-support:bidi-mutation-listener.js",
out = "bidi-mutation-listener.js",
visibility = ["//javascript/node/selenium-webdriver:__pkg__"],
)
Original file line number Diff line number Diff line change
@@ -0,0 +1,55 @@
// Licensed to the Software Freedom Conservancy (SFC) under one
// or more contributor license agreements. See the NOTICE file
// distributed with this work for additional information
// regarding copyright ownership. The SFC licenses this file
// to you under the Apache License, Version 2.0 (the
// "License"); you may not use this file except in compliance
// with the License. You may obtain a copy of the License at
//
// http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing,
// software distributed under the License is distributed on an
// "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
// KIND, either express or implied. See the License for the
// specific language governing permissions and limitations
// under the License.

function observeMutations(channel) {
const observer = new MutationObserver((mutations) => {
for (const mutation of mutations) {
switch (mutation.type) {
case 'attributes':
// Don't report our own attribute has changed.
if (mutation.attributeName === 'data-__webdriver_id') {
break
}
const curr = mutation.target.getAttribute(mutation.attributeName)
let id = mutation.target.dataset.__webdriver_id
if (!id) {
id = Math.random().toString(36).substring(2) + Date.now().toString(36)
mutation.target.dataset.__webdriver_id = id
}
const json = JSON.stringify({
target: id,
name: mutation.attributeName,
value: curr,
oldValue: mutation.oldValue,
})
channel(json)
break
default:
break
}
}
})

observer.observe(document, {
attributes: true,
attributeOldValue: true,
characterData: true,
characterDataOldValue: true,
childList: true,
subtree: true,
})
}
54 changes: 54 additions & 0 deletions javascript/node/selenium-webdriver/lib/script.js
Original file line number Diff line number Diff line change
Expand Up @@ -16,10 +16,17 @@
// under the License.

const logInspector = require('../bidi/logInspector')
const scriptManager = require('../bidi//scriptManager')
const { ArgumentValue } = require('../bidi/argumentValue')
const { LocalValue, ChannelValue } = require('../bidi/protocolValue')
const fs = require('node:fs')
const path = require('node:path')
const by = require('./by')

class Script {
#driver
#logInspector
#script

constructor(driver) {
this.#driver = driver
Expand All @@ -38,6 +45,13 @@ class Script {
this.#logInspector = await logInspector(this.#driver)
}

async #initScript() {
if (this.#script !== undefined) {
return
}
this.#script = await scriptManager([], this.#driver)
}

async addJavaScriptErrorHandler(callback) {
await this.#init()
return await this.#logInspector.onJavascriptException(callback)
Expand All @@ -58,6 +72,46 @@ class Script {

await this.#logInspector.removeCallback(id)
}

async addDomMutationHandler(callback) {
await this.#initScript()

let argumentValues = []
let value = new ArgumentValue(LocalValue.createChannelValue(new ChannelValue('channel_name')))
argumentValues.push(value)

const filePath = path.join(__dirname, 'atoms', 'bidi-mutation-listener.js')

let mutationListener = fs.readFileSync(filePath, 'utf-8').toString()
await this.#script.addPreloadScript(mutationListener, argumentValues)

let id = await this.#script.onMessage(async (message) => {
let payload = JSON.parse(message['data']['value'])
let elements = await this.#driver.findElements({
css: '*[data-__webdriver_id=' + by.escapeCss(payload['target']) + ']',
})

if (elements.length === 0) {
return
}

let event = {
element: elements[0],
attribute_name: payload['name'],
current_value: payload['value'],
old_value: payload['oldValue'],
}
callback(event)
})

return id
}

async removeDomMutationHandler(id) {
await this.#initScript()

await this.#script.removeCallback(id)
}
}

module.exports = Script
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,8 @@
const assert = require('node:assert')
const { Browser } = require('selenium-webdriver')
const { Pages, suite } = require('../../lib/test')
const fileServer = require('../../lib/test/fileserver')
const until = require('selenium-webdriver/lib/until')

suite(
function (env) {
Expand Down Expand Up @@ -84,6 +86,42 @@ suite(
assert.strictEqual(e.message, 'Callback with id 10 not found')
}
})

it('can listen to dom mutations', async function () {
let message = null
await driver.script().addDomMutationHandler((m) => {
message = m
})

await driver.get(fileServer.Pages.dynamicPage)

let element = driver.findElement({ id: 'reveal' })
await element.click()
let revealed = driver.findElement({ id: 'revealed' })
await driver.wait(until.elementIsVisible(revealed), 5000)

assert.strictEqual(message['attribute_name'], 'style')
assert.strictEqual(message['current_value'], '')
assert.strictEqual(message['old_value'], 'display:none;')
})

it('can remove to dom mutation handler', async function () {
let message = null
let id = await driver.script().addDomMutationHandler((m) => {
message = m
})

await driver.get(fileServer.Pages.dynamicPage)

await driver.script().removeDomMutationHandler(id)

let element = driver.findElement({ id: 'reveal' })
await element.click()
let revealed = driver.findElement({ id: 'revealed' })
await driver.wait(until.elementIsVisible(revealed), 5000)

assert.strictEqual(message, null)
})
})
},
{ browsers: [Browser.FIREFOX, Browser.CHROME, Browser.EDGE] },
Expand Down

0 comments on commit 0f68841

Please sign in to comment.