Skip to content

fix(webdriverio): implement switchFrame for Bidi#13728

Merged
christian-bromann merged 8 commits intomainfrom
cb/better-frame-switch
Oct 11, 2024
Merged

fix(webdriverio): implement switchFrame for Bidi#13728
christian-bromann merged 8 commits intomainfrom
cb/better-frame-switch

Conversation

@christian-bromann
Copy link
Member

@christian-bromann christian-bromann commented Oct 2, 2024 •
edited
Loading

Proposed changes

This is a new approach to handle frame switches with Bidi. I want to introduce a new command switchFrame (aligned with other commands like switchWindow) that simplifies the way user can switch into frames.

Command docs:

Switches the active context to a frame, e.g. an iframe on the page. There are multiple ways you can query a frame
on the page:

  • If given a string it switches to the frame with a matching context id, url or url that contains that string

    // switch to a frame that has the url "https://the-internet.herokuapp.com/iframe"
await browser.switchFrame('https://the-internet.herokuapp.com/iframe')
// switch to a frame that has a certain context id
await browser.switchFrame('A5734774C41F8C91D483BDD4022B2EF3')

  • If given a WebdriverIO element that references an iframe element it will switch to that frame

    // switch to a frame element queried from current context
await browser.switchFrame($('iframe'))

  • If given a function it will loop through all iframes on the page and call the function with the context
    object. The function should return a boolean indicating if the frame should be selected. Within the function
    you can use WebdriverIO commands to e.g. check if a certain frame element exists.

    // switch to first frame that contains an element with id "#frameContent"
await browser.switchFrame(() => $('#frameContent').isExisting())

  • If given null it will switch to the top level frame

    // first switch into a frame
await browser.switchFrame($('iframe'))
// do more automation within that frame, then ...

// switch to the top level frame
await browser.switchFrame(null)

Types of changes

  • Polish (an improvement for an existing feature)
  • Bugfix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to not work as expected)
  • Documentation update (improvements to the project's docs)
  • Specification changes (updates to WebDriver command specifications)
  • Internal updates (everything related to internal scripts, governance documentation and CI files)

Checklist

  • I have read the CONTRIBUTING doc
  • I have added tests that prove my fix is effective or that my feature works
  • I have added the necessary documentation (if appropriate)
  • I have added proper type definitions for new commands (if appropriate)

Backport Request

//: # (The current main branch is the development branch for WebdriverIO v9. If your change should be released to the current major version of WebdriverIO (v8), please raise another PR with the same changes against the v8 branch.)

  • This change is solely for v9 and doesn't need to be back-ported
  • Back-ported PR at #XXXXX

Further comments

Reviewers: @webdriverio/project-committers

@christian-bromann christian-bromann mentioned this pull request Oct 2, 2024
Closed
13 tasks
@pkg-pr-new
Copy link

pkg-pr-new bot commented Oct 2, 2024 •
edited
Loading

Open in Stackblitz

eslint-plugin-wdio

pnpm add https://pkg.pr.new/webdriverio/webdriverio/eslint-plugin-wdio@13728

@wdio/allure-reporter

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/allure-reporter@13728

@wdio/appium-service

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/appium-service@13728

@wdio/browser-runner

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/browser-runner@13728

@wdio/browserstack-service

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/browserstack-service@13728

@wdio/cli

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/cli@13728

@wdio/config

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/config@13728

@wdio/concise-reporter

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/concise-reporter@13728

@wdio/cucumber-framework

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/cucumber-framework@13728

@wdio/dot-reporter

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/dot-reporter@13728

@wdio/firefox-profile-service

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/firefox-profile-service@13728

@wdio/globals

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/globals@13728

@wdio/jasmine-framework

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/jasmine-framework@13728

@wdio/json-reporter

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/json-reporter@13728

@wdio/junit-reporter

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/junit-reporter@13728

@wdio/lighthouse-service

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/lighthouse-service@13728

@wdio/local-runner

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/local-runner@13728

@wdio/logger

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/logger@13728

@wdio/mocha-framework

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/mocha-framework@13728

@wdio/protocols

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/protocols@13728

@wdio/repl

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/repl@13728

@wdio/reporter

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/reporter@13728

@wdio/runner

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/runner@13728

@wdio/sauce-service

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/sauce-service@13728

@wdio/shared-store-service

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/shared-store-service@13728

@wdio/smoke-test-cjs-service

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/smoke-test-cjs-service@13728

@wdio/smoke-test-reporter

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/smoke-test-reporter@13728

@wdio/spec-reporter

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/spec-reporter@13728

@wdio/smoke-test-service

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/smoke-test-service@13728

@wdio/static-server-service

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/static-server-service@13728

@wdio/sumologic-reporter

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/sumologic-reporter@13728

@wdio/testingbot-service

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/testingbot-service@13728

@wdio/types

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/types@13728

@wdio/utils

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/utils@13728

@wdio/webdriver-mock-service

pnpm add https://pkg.pr.new/webdriverio/webdriverio/@wdio/webdriver-mock-service@13728

webdriver

pnpm add https://pkg.pr.new/webdriverio/webdriverio/webdriver@13728

webdriverio

pnpm add https://pkg.pr.new/webdriverio/webdriverio@13728

commit: 9c0ef3f

@christian-bromann christian-bromann marked this pull request as ready for review October 11, 2024 19:20
@christian-bromann christian-bromann changed the title fix(webdriverio): implement switchToFrame for Bidi fix(webdriverio): implement switchFrame for Bidi Oct 11, 2024
erwinheitzman
erwinheitzman reviewed Oct 11, 2024
View reviewed changes
packages/webdriverio/src/commands/browser/switchFrame.ts
* transform context tree into a flat list of context objects with references
* to children
*/
const allContexts: Record<string, FlatContextTree> = tree.contexts.map(mapContext).flat(Infinity)
Copy link
Member

@erwinheitzman erwinheitzman Oct 11, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

what does the .flat(Infinite) do here? haven't seen this before

Copy link
Member Author

@christian-bromann christian-bromann Oct 11, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

.flat() by default only flattens with a depth of 1, so:

[1, [2, [3]]].flat() === [1, 2, [3]]

With infinity we flatten the array infinity times:

[1, [2, [3]]].flat() === [1, 2, 3]

erwinheitzman
erwinheitzman reviewed Oct 11, 2024
View reviewed changes
erwinheitzman
erwinheitzman reviewed Oct 11, 2024
View reviewed changes
erwinheitzman
erwinheitzman approved these changes Oct 11, 2024
View reviewed changes
Copy link
Member

@erwinheitzman erwinheitzman left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Added some suggestions but nothing major, looking great Christian. Well done, love how clean and readable the code is!

@christian-bromann christian-bromann merged commit c905575 into main Oct 11, 2024
@christian-bromann christian-bromann deleted the cb/better-frame-switch branch October 11, 2024 22:49
@danielhjacobs
Copy link
Contributor

danielhjacobs commented Oct 13, 2024 •
edited
Loading

This doesn't appear to work for classic frame elements.

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/frame

@torokati44 torokati44 mentioned this pull request Oct 15, 2024
Closed
3 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@erwinheitzman erwinheitzman erwinheitzman approved these changes

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

3 participants

@christian-bromann @danielhjacobs @erwinheitzman