Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[🐛 Bug]: Element.getText() returns empty string for Web Component on Firefox #11360

Closed
3 tasks done
muhqu opened this issue Oct 6, 2023 · 1 comment
Closed
3 tasks done

[🐛 Bug]: Element.getText() returns empty string for Web Component on Firefox #11360

muhqu opened this issue Oct 6, 2023 · 1 comment
Labels
Bug 🐛 Needs Triaging ⏳ No one has looked into the issue yet

Comments

@muhqu
Copy link

muhqu commented Oct 6, 2023 •
edited

Have you read the Contributing Guidelines on issues?

WebdriverIO Version

8.16.20

Node.js Version

v18.17.1

Mode

Standalone Mode

Which capabilities are you using?

{
  browserName: 'firefox'
}

What happened?

I'm testing a web application that uses web components. When trying to get the text of a web component element, e.g. a custom button, I always get an empty string in firefox. Chrome works without problem.

See https://opensource.adobe.com/spectrum-web-components/storybook/iframe.html?id=button-primary-fill-sizes--m&args=&viewMode=story for an example Web Component.

What is your expected behavior?

No response

How to reproduce the bug.

To reproduce the bug, create a file with the following code:

#!/usr/bin/env node

import { remote } from 'webdriverio'

async function main() {
    const browser = await remote({
        capabilities: {
            browserName: 'firefox',
        }
    })

    await browser.url('https://opensource.adobe.com/spectrum-web-components/storybook/iframe.html?id=button-primary-fill-sizes--m&args=&viewMode=story')

    const allButtons = await browser.$$('>>> [role="button"]')
    console.log('allButtons.length: ', allButtons.length)
    // correct : 3

    let allButtonTexts = await Promise.all(allButtons.map(async (button) => {
        return await button.getText()
    }))
    console.log('allButtonTexts: ', allButtonTexts)
    // expected : ['Click Me', 'Click Me', 'Click Me']      works in Chrome
    // actual   : ['', '', '']                              fails in Firefox


    // work-around
    allButtonTexts = await Promise.all(allButtons.map(async (button) => {
        return await button.executeScript('return arguments[0].innerText',[button])
    }))
    console.log('allButtonTexts: ', allButtonTexts)
    // correct  : ['Click Me', 'Click Me', 'Click Me']      works in Firefox and Chrome

    await browser.deleteSession()
}

main()

Then run:

$ node reproducibleExample.mjs

Relevant log output

2023-10-06T14:52:56.424Z INFO webdriver: Initiate new session using the WebDriver protocol
2023-10-06T14:52:56.929Z INFO geckodriver: Starting Geckodriver at /var/folders/8g/fc7f_9p94ysfv_x7l933vxg40000gq/T/geckodriver with params: --port=55186 --allow-hosts=0.0.0.0 --host=0.0.0.0 --websocket-port=0
2023-10-06T14:52:56.937Z INFO geckodriver: 1696603976936        geckodriver     INFO    Listening on 0.0.0.0:55186
2023-10-06T14:52:57.937Z INFO @wdio/utils: Started GeckoDriver in 1512ms on port 55186
2023-10-06T14:52:57.949Z INFO webdriver: [POST] http://0.0.0.0:55186/session
2023-10-06T14:52:57.949Z INFO webdriver: DATA {
  capabilities: {
    alwaysMatch: { browserName: 'firefox', 'moz:firefoxOptions': [Object] },
    firstMatch: [ {} ]
  },
  desiredCapabilities: {
    browserName: 'firefox',
    'moz:firefoxOptions': { binary: '/Applications/Firefox.app/Contents/MacOS/Firefox' }
  }
}
2023-10-06T14:52:57.958Z INFO geckodriver: 1696603977958        mozrunner::runner       INFO    Running command: MOZ_CRASHREPORTER="1" MOZ_CRASHREPORTER_NO_REPORT="1" MOZ_CRASHREPORTER_SHUTDOWN="1" MOZ_NO_REMOTE="1" "/App ... "--marionette" "-foreground" "-no-remote" "-profile" "/var/folders/8g/fc7f_9p94ysfv_x7l933vxg40000gq/T/rust_mozprofileak5zzt"
2023-10-06T14:52:58.101Z INFO geckodriver: console.warn: services.settings: Ignoring preference override of remote settings server
2023-10-06T14:52:58.101Z INFO geckodriver: console.warn: services.settings: Allow by setting MOZ_REMOTE_SETTINGS_DEVTOOLS=1 in the environment
2023-10-06T14:52:58.349Z INFO geckodriver: 1696603978347        Marionette      INFO    Marionette enabled
2023-10-06T14:52:58.483Z INFO geckodriver: 1696603978483        Marionette      INFO    Listening on port 55213
2023-10-06T14:52:58.578Z INFO geckodriver: Read port: 55213
2023-10-06T14:52:58.924Z WARN geckodriver: UNSUPPORTED (log once): POSSIBLE ISSUE: unit 1 GLD_TEXTURE_INDEX_2D is unloadable and bound to sampler type (Float) - using zero texture because texture unloadable
2023-10-06T14:52:59.369Z INFO webdriver: COMMAND navigateTo("https://opensource.adobe.com/spectrum-web-components/storybook/iframe.html?id=button-primary-fill-sizes--m&args=&viewMode=story")
2023-10-06T14:52:59.369Z INFO webdriver: [POST] http://0.0.0.0:55186/session/716f78eb-51a6-4d9d-b3c4-debba433fba5/url
2023-10-06T14:52:59.369Z INFO webdriver: DATA {
  url: 'https://opensource.adobe.com/spectrum-web-components/storybook/iframe.html?id=button-primary-fill-sizes--m&args=&viewMode=story'
}
2023-10-06T14:53:01.109Z INFO webdriver: RESULT null
2023-10-06T14:53:01.109Z INFO webdriver: COMMAND executeScript(<fn>, <object>)
2023-10-06T14:53:01.109Z INFO webdriver: [POST] http://0.0.0.0:55186/session/716f78eb-51a6-4d9d-b3c4-debba433fba5/execute/sync
2023-10-06T14:53:01.109Z INFO webdriver: DATA {
  script: 'querySelectorAllDeep(...) [11573 bytes]',
  args: [ true, ' [role="button"]', undefined ]
}
2023-10-06T14:53:01.480Z INFO webdriver: RESULT [
  {
    'element-6066-11e4-a52e-4f735466cecf': 'f857ccd2-fa43-4001-8362-6c9d2f9563da'
  },
  {
    'element-6066-11e4-a52e-4f735466cecf': 'e3828da7-fed4-4909-844e-83a0107febbb'
  },
  {
    'element-6066-11e4-a52e-4f735466cecf': '32f69c85-87f4-4f8f-a7cc-037a9001a5ad'
  }
]
allButtons.length:  3
2023-10-06T14:53:01.484Z INFO webdriver: COMMAND getElementText("f857ccd2-fa43-4001-8362-6c9d2f9563da")
2023-10-06T14:53:01.484Z INFO webdriver: COMMAND getElementText("e3828da7-fed4-4909-844e-83a0107febbb")
2023-10-06T14:53:01.485Z INFO webdriver: COMMAND getElementText("32f69c85-87f4-4f8f-a7cc-037a9001a5ad")
2023-10-06T14:53:01.485Z INFO webdriver: [GET] http://0.0.0.0:55186/session/716f78eb-51a6-4d9d-b3c4-debba433fba5/element/f857ccd2-fa43-4001-8362-6c9d2f9563da/text
2023-10-06T14:53:01.485Z INFO webdriver: [GET] http://0.0.0.0:55186/session/716f78eb-51a6-4d9d-b3c4-debba433fba5/element/e3828da7-fed4-4909-844e-83a0107febbb/text
2023-10-06T14:53:01.485Z INFO webdriver: [GET] http://0.0.0.0:55186/session/716f78eb-51a6-4d9d-b3c4-debba433fba5/element/32f69c85-87f4-4f8f-a7cc-037a9001a5ad/text
2023-10-06T14:53:01.498Z INFO webdriver: RESULT 
2023-10-06T14:53:01.499Z INFO webdriver: RESULT 
2023-10-06T14:53:01.501Z INFO webdriver: RESULT 
allButtonTexts:  [ '', '', '' ]
2023-10-06T14:53:01.501Z INFO webdriver: COMMAND executeScript("return arguments[0].innerText", <object>)
2023-10-06T14:53:01.502Z INFO webdriver: COMMAND executeScript("return arguments[0].innerText", <object>)
2023-10-06T14:53:01.502Z INFO webdriver: COMMAND executeScript("return arguments[0].innerText", <object>)
2023-10-06T14:53:01.502Z INFO webdriver: [POST] http://0.0.0.0:55186/session/716f78eb-51a6-4d9d-b3c4-debba433fba5/execute/sync
2023-10-06T14:53:01.502Z INFO webdriver: DATA {
  script: 'return arguments[0].innerText',
  args: [
    Element {
      sessionId: '716f78eb-51a6-4d9d-b3c4-debba433fba5',
      elementId: 'f857ccd2-fa43-4001-8362-6c9d2f9563da',
      'element-6066-11e4-a52e-4f735466cecf': 'f857ccd2-fa43-4001-8362-6c9d2f9563da',
      selector: '>>> [role="button"]',
      parent: [Browser],
      index: 0,
      emit: [Function: bound ],
      isReactElement: false,
      isShadowElement: false,
      addCommand: [Function (anonymous)],
      overwriteCommand: [Function (anonymous)]
    }
  ]
}
2023-10-06T14:53:01.503Z INFO webdriver: [POST] http://0.0.0.0:55186/session/716f78eb-51a6-4d9d-b3c4-debba433fba5/execute/sync
2023-10-06T14:53:01.503Z INFO webdriver: DATA {
  script: 'return arguments[0].innerText',
  args: [
    Element {
      sessionId: '716f78eb-51a6-4d9d-b3c4-debba433fba5',
      elementId: 'e3828da7-fed4-4909-844e-83a0107febbb',
      'element-6066-11e4-a52e-4f735466cecf': 'e3828da7-fed4-4909-844e-83a0107febbb',
      selector: '>>> [role="button"]',
      parent: [Browser],
      index: 1,
      emit: [Function: bound ],
      isReactElement: false,
      isShadowElement: false,
      addCommand: [Function (anonymous)],
      overwriteCommand: [Function (anonymous)]
    }
  ]
}
2023-10-06T14:53:01.503Z INFO webdriver: [POST] http://0.0.0.0:55186/session/716f78eb-51a6-4d9d-b3c4-debba433fba5/execute/sync
2023-10-06T14:53:01.503Z INFO webdriver: DATA {
  script: 'return arguments[0].innerText',
  args: [
    Element {
      sessionId: '716f78eb-51a6-4d9d-b3c4-debba433fba5',
      elementId: '32f69c85-87f4-4f8f-a7cc-037a9001a5ad',
      'element-6066-11e4-a52e-4f735466cecf': '32f69c85-87f4-4f8f-a7cc-037a9001a5ad',
      selector: '>>> [role="button"]',
      parent: [Browser],
      index: 2,
      emit: [Function: bound ],
      isReactElement: false,
      isShadowElement: false,
      addCommand: [Function (anonymous)],
      overwriteCommand: [Function (anonymous)]
    }
  ]
}
2023-10-06T14:53:01.508Z INFO webdriver: RESULT Click Me
2023-10-06T14:53:01.509Z INFO webdriver: RESULT Click Me
2023-10-06T14:53:01.511Z INFO webdriver: RESULT Click Me
allButtonTexts:  [ 'Click Me', 'Click Me', 'Click Me' ]
2023-10-06T14:53:01.511Z INFO webdriver: COMMAND deleteSession()
2023-10-06T14:53:01.511Z INFO webdriver: [DELETE] http://0.0.0.0:55186/session/716f78eb-51a6-4d9d-b3c4-debba433fba5
2023-10-06T14:53:01.513Z INFO geckodriver: 1696603981512        Marionette      INFO    Stopped listening on port 55213
2023-10-06T14:53:01.921Z INFO webdriver: RESULT null
2023-10-06T14:53:01.922Z INFO webdriver: Kill /var/folders/8g/fc7f_9p94ysfv_x7l933vxg40000gq/T/geckodriver driver process with command line: --port=55186 --allow-hosts=0.0.0.0 --host=0.0.0.0 --websocket-port=0

Code of Conduct

  • I agree to follow this project's Code of Conduct

Is there an existing issue for this?

  • I have searched the existing issues
@muhqu muhqu added Bug 🐛 Needs Triaging ⏳ No one has looked into the issue yet labels Oct 6, 2023
@muhqu muhqu changed the title [🐛 Bug]: Element.getText() returns empty string for Web Component with shadow dom [🐛 Bug]: Element.getText() returns empty string for Web Component on Firefox Oct 6, 2023
@christian-bromann
Copy link
Member

@muhqu thanks for reporting this issue.

This seems to be a bug with Firefox and Geckodriver. I recommend raising a bug issue in https://www.google.com/search?q=geckodriver+github&sourceid=chrome&ie=UTF-8 with the same description and maybe adding the logs for it.

Thank you!

@muhqu muhqu mentioned this issue Oct 7, 2023
Closed
@bwajtr bwajtr mentioned this issue Nov 10, 2023
Open
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
Bug 🐛 Needs Triaging ⏳ No one has looked into the issue yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@muhqu @christian-bromann