How to use shadow_root method of Selenium.WebDriver Package

Best Selenium code snippet using Selenium.WebDriver.shadow_root

search_item_job.rb

Source:search_item_job.rb Github

copy

Full Screen

...46 47 # ポップアップ等が先に出ていると正しく要素を取得できない可能性があるため、ここでサイトを更新48 driver.navigate.refresh49 50 # 欲しい情報がshadow_rootに格納されていたのでshadow_rootの中身を読み込めるよう以下のようにステップを踏んで情報を取得51 begin52 item_list = driver.find_elements(:xpath, "//*[@id='item-grid']/ul/li")53 rescue Selenium::WebDriver::Error::NoSuchElementError54 p 'no such element error!!'55 return56 end57 58 item_links = []59 item_list.each do |item|60 item_num = item_list.find_index(item) + 161 item_link = driver.find_element(:xpath, "//*[@id='item-grid']/ul/li[#{item_num}]/a").attribute('href')62 item_links << item_link63 end64 65 item_links.each do |link|66 driver.get(link)67 # ちゃんと開けているか確認するためpage_loadのwaitを入れる68 driver.manage.timeouts.page_load = @wait_time69 70 # 商品名を取得71 begin72 shadow_host = driver.find_element(:css, '.mer-spacing-b-2')73 shadow_root = shadow_host.shadow_root74 name = shadow_root.find_element(:tag_name, 'h1').text75 rescue Selenium::WebDriver::Error::NoSuchElementError76 p 'no such element error!!'77 return78 end79 80 # 価格を取得81 begin82 shadow_host = driver.find_element(:css, '.mer-spacing-r-8')83 shadow_root = shadow_host.shadow_root84 price = shadow_root.find_element(:css, '.number').text.gsub(/,/, "") # textで取得するとカンマも一緒に取得してしまう。intに変換される際に、カンマより上の桁しか取得できないのでgsub85 rescue Selenium::WebDriver::Error::NoSuchElementError86 p 'no such element error!!'87 return88 end89 90 # 概要欄を取得91 begin92 shadow_host = driver.find_element(:xpath, "//*[@id='item-info']/section[2]/mer-show-more")93 shadow_root = shadow_host.shadow_root94 content = shadow_root.find_element(:css, '.content.clamp').text95 rescue Selenium::WebDriver::Error::NoSuchElementError96 p 'no such element error!!'97 return98 end99 100 # 取得した情報をDBに書き込み101 if Item.find_by(url: link)102 # 同一商品がDBに保存されていた場合の処理103 registered_item = Item.find_by(url: link)104 # 今回取得したname, price, contentと差異がある場合はupdate/ そうでなければtouchでtimestampを更新105 if registered_item.name != name || registered_item.price != price || registered_item.content != content106 registered_item.update(name: name, price: price, content: content)107 else108 registered_item.touch109 end110 else111 # DB内に同一の商品がないので、新規書き込み112 cpu_model.items.create!(name: name, url: link, price: price, content: content)113 end114 sleep 0.8115 end116 117 # ========== 商品情報取得完了後、検索結果一覧ページに戻る ==========118 119 driver.get(search_url)120 121 sleep 0.5122 123 124 125 126 127 # 最終ページ(前へボタンしかない状態)でもbutton_doubleの変数の値が残ってしまい、roopから抜けないので、ここでreset128 button_single = nil129 button_double = nil130 # 各ボタンを再取得131 begin132 button_single = driver.find_element(:xpath, "//*[@id='search-result']/div/div/div/div[1]/mer-button/button")133 rescue134 nil135 end136 137 begin138 button_double = driver.find_element(:xpath, "//*[@id='search-result']/div/div/div/div[1]/mer-button[2]/button")139 rescue140 nil141 end142 143 144 # button_singleがnil、つまり検索結果が1ページだった場合はもちろんループを抜ける。145 break if button_single == nil146 147 # また最終ページ(button_doubleがnilのまま更新されない)の場合もループを抜ける。148 break if button_double == nil && button_single.text == "前へ"149 150 # 次のページがある時は「次へ」ボタンを押す処理151 if button_single152 # button_singleをifの条件に書くと少し厄介なことになるので、doubleのほうでひっかける。153 # (2ページ目以降、つまり前へ、次へどちらのボタンもあるページではbutton_singleのxpathが154 # 前へ、次へのbuttonタグを内包する配列のxpathとなっているため、button_singleはnilにならず、前へボタンを取得してしまい、155 # ページが進まなくなる)156 if button_double157 button_double.click158 else159 button_single.click160 end161 sleep 0.8162 # ページ遷移後のURLを新しいsearch_urlとして更新する163 search_url = driver.current_url164 end165 end166 end167 # driverをとじる168 puts "CPUの検索が終了しました"169 driver.quit170 # ========== 取得したCPUリストをCSVに ==========171 172 # cpuのリストを取得173 items = Item.where(gpu_model_id: nil).includes(:cpu_model)174 filename = Date.current.strftime("%Y%m%d") + "_cpu_list.csv"175 columns_ja = ["モデル名", "商品名", "商品URL", "価格", "商品概要", "取得日", "最終更新日"]176 columns = ["model_name", "name", "url", "price", "content", "created_at", "updated_at"]177 csv_cpu = CSV.generate do |csv|178 csv << columns_ja # 1行目には日本語のカラム名を入力179 items.each do |item|180 item_attributes = item.attributes181 # cpu_model.nameを引っ張ってくる。182 item_attributes["model_name"] = URI.decode_www_form_component(item.cpu_model.name)183 csv << item_attributes.values_at(*columns)184 end185 end186 # csvファイルに出力187 File.open("./tmp/csv/#{filename}", "w") do |file|188 file.write(csv_cpu)189 end190 191 puts "取得したCPUリストをCSVに出力しました"192 # =============================================================================================================193 # =============================================================================================================194 # GPU検索開始195 puts "これよりGPUの検索を開始します"196 # ========== WebDriverの準備 ===========197 @wait_time = 10198 @timeout = 4199 200 # Seleniumの初期化201 driver = Selenium::WebDriver.for :chrome202 # windowを最大化(windowの初期サイズだと押せないボタンがあるため)203 driver.manage.window.maximize204 # driverがきちんと起動したか、暗黙的な待機を入れる205 driver.manage.timeouts.implicit_wait = @timeout206 wait = Selenium::WebDriver::Wait.new(timeout: @wait_time)207 GpuModel.all.each do |gpu_model|208 # 検索ワードを設定209 search_word = gpu_model.name210 search_url = "https://jp.mercari.com/search?keyword=#{search_word}&status=on_sale"211 # メルカリ(検索結果)を開く212 driver.get(search_url)213 # ちゃんと開けているか確認するためpage_loadのwaitを入れる214 driver.manage.timeouts.page_load = @wait_time215 # ========== ページ遷移のための処理 ==========216 217 # 以下は「次へ」ボタンを取得するための処理218 # 次へ、のリンクしかない(初めのページ)はほかのページとxpathが違うので、下記の通り、2パターンのxpathを219 # 拾えるようにする。no such elementsで例外が出ないように、rescueでnilにしてあげる。220 begin221 button_single = driver.find_element(:xpath, "//*[@id='search-result']/div/div/div/div[1]/mer-button/button")222 rescue223 nil224 end225 226 begin227 button_double = driver.find_element(:xpath, "//*[@id='search-result']/div/div/div/div[1]/mer-button[2]/button")228 rescue229 nil230 end231 # ページ遷移のためのループ232 while true233 234 235 # ========== 商品リンクをクリックする繰り返し ==========236 237 # ポップアップ等が先に出ていると正しく要素を取得できない可能性があるため、ここでサイトを更新238 driver.navigate.refresh239 240 # 欲しい情報がshadow_rootに格納されていたのでshadow_rootの中身を読み込めるよう以下のようにステップを踏んで情報を取得241 begin242 item_list = driver.find_elements(:xpath, "//*[@id='item-grid']/ul/li")243 rescue Selenium::WebDriver::Error::NoSuchElementError244 p 'no such element error!!'245 return246 end247 248 item_links = []249 item_list.each do |item|250 item_num = item_list.find_index(item) + 1251 item_link = driver.find_element(:xpath, "//*[@id='item-grid']/ul/li[#{item_num}]/a").attribute('href')252 item_links << item_link253 end254 255 item_links.each do |link|256 driver.get(link)257 # ちゃんと開けているか確認するためpage_loadのwaitを入れる258 driver.manage.timeouts.page_load = @wait_time259 260 # 商品名を取得261 begin262 shadow_host = driver.find_element(:css, '.mer-spacing-b-2')263 shadow_root = shadow_host.shadow_root264 name = shadow_root.find_element(:tag_name, 'h1').text265 rescue Selenium::WebDriver::Error::NoSuchElementError266 p 'no such element error!!'267 return268 end269 270 # 価格を取得271 begin272 shadow_host = driver.find_element(:css, '.mer-spacing-r-8')273 shadow_root = shadow_host.shadow_root274 price = shadow_root.find_element(:css, '.number').text.gsub(/,/, "") # textで取得するとカンマも一緒に取得してしまう。intに変換される際に、カンマより上の桁しか取得できないのでgsub275 rescue Selenium::WebDriver::Error::NoSuchElementError276 p 'no such element error!!'277 return278 end279 280 # 概要欄を取得281 begin282 shadow_host = driver.find_element(:xpath, "//*[@id='item-info']/section[2]/mer-show-more")283 shadow_root = shadow_host.shadow_root284 content = shadow_root.find_element(:css, '.content.clamp').text285 rescue Selenium::WebDriver::Error::NoSuchElementError286 p 'no such element error!!'287 return288 end289 290 291 # 取得した情報をDBに書き込み292 if Item.find_by(url: link)293 # 同一商品がDBに保存されていた場合の処理294 registered_item = Item.find_by(url: link)295 # 今回取得したname, price, contentと差異がある場合はupdate/ そうでなければtouchでtimestampを更新296 if registered_item.name != name || registered_item.price != price || registered_item.content != content297 registered_item.update(name: name, price: price, content: content)298 else...

Full Screen

Full Screen

selenium_spec_firefox.rb

Source:selenium_spec_firefox.rb Github

copy

Full Screen

...60 pending "Firefox < 62 doesn't support a DataTransfer constuctor" if firefox_lt?(62.0, @session)61 when 'Capybara::Session selenium #accept_alert should handle the alert if the page changes',62 'Capybara::Session selenium #accept_alert with an asynchronous alert should accept the alert'63 skip 'No clue what Firefox is doing here - works fine on MacOS locally'64 when 'Capybara::Session selenium node #shadow_root should get the shadow root',65 'Capybara::Session selenium node #shadow_root should find elements inside the shadow dom using CSS',66 'Capybara::Session selenium node #shadow_root should find nested shadow roots'67 pending "Firefox doesn't yet have W3C shadow root support"68 end69end70RSpec.describe 'Capybara::Session with firefox' do # rubocop:disable RSpec/MultipleDescribes71 include Capybara::SpecHelper72 ['Capybara::Session', 'Capybara::Node', Capybara::RSpecMatchers].each do |examples|73 include_examples examples, TestSessions::SeleniumFirefox, :selenium_firefox74 end75 describe 'filling in Firefox-specific date and time fields with keystrokes' do76 let(:datetime) { Time.new(1983, 6, 19, 6, 30) }77 let(:session) { TestSessions::SeleniumFirefox }78 before do79 session.visit('/form')80 end...

Full Screen

Full Screen

selenium_spec_safari.rb

Source:selenium_spec_safari.rb Github

copy

Full Screen

...71 pending 'w3c_click_offset is not currently supported with safaridriver'72 when 'Capybara::Session selenium_safari #go_back should fetch a response from the driver from the previous page',73 'Capybara::Session selenium_safari #go_forward should fetch a response from the driver from the previous page'74 skip 'safaridriver loses the ability to find elements in the document after `go_back`'75 when 'Capybara::Session selenium node #shadow_root should get the shadow root',76 'Capybara::Session selenium node #shadow_root should find elements inside the shadow dom using CSS',77 'Capybara::Session selenium node #shadow_root should find nested shadow roots'78 pending "Safari doesn't yet have W3C shadow root support"79 end80end81RSpec.describe 'Capybara::Session with safari' do82 include Capybara::SpecHelper83 ['Capybara::Session', 'Capybara::Node', Capybara::RSpecMatchers].each do |examples|84 include_examples examples, TestSessions::Safari, SAFARI_DRIVER85 end86 context 'storage' do87 describe '#reset!' do88 it 'clears storage by default' do89 session = TestSessions::Safari90 session.visit('/with_js')91 session.find(:css, '#set-storage').click...

Full Screen

Full Screen

common.rb

Source:common.rb Github

copy

Full Screen

...77require 'selenium/webdriver/common/options'78require 'selenium/webdriver/common/takes_screenshot'79require 'selenium/webdriver/common/driver'80require 'selenium/webdriver/common/element'81require 'selenium/webdriver/common/shadow_root'...

Full Screen

Full Screen

selenium_mercari.rb

Source:selenium_mercari.rb Github

copy

Full Screen

...16driver.manage.timeouts.page_load = @wait_time17# ========================== ここから商品情報取得のための処理セット ======================================18# ポップアップ等が先に出ていると正しく要素を取得できない可能性があるため、ここでサイトを更新19driver.navigate.refresh20# 欲しい情報がshadow_rootに格納されていたのでshadow_rootの中身を読み込めるよう以下のようにステップを踏んで情報を取得21begin22 # 値段を取得23 shadow_host = driver.find_element(:xpath, "//*[@id='item-grid']/ul/li[1]/a/mer-item-thumbnail")24 shadow_root = shadow_host.shadow_root25 item_link = shadow_root.find_element(:css, '.item-name')26rescue Selenium::WebDriver::Error::NoSuchElementError27 p 'no such element error!!'28 return29end30# item-name(商品名)を取得31item_name = item_link.text32puts item_name33# 商品詳細ページへジャンプ34item_link.click35# ページ読み込みを待つ36page_title = "#{item_name} - メルカリ"37wait.until {driver.title == page_title}38# 商品のURLを取得し、出力39item_url = driver.current_url40puts item_url41begin42 # 値段を取得43 shadow_host = driver.find_element(:xpath, "//*[@id='item-info']/section[1]/section[1]/div/mer-price")44 shadow_root = shadow_host.shadow_root45 price = shadow_root.find_element(:css, '.number').text46rescue Selenium::WebDriver::Error::NoSuchElementError47 p 'no such element error!!'48 return49end50puts price51begin52 # 概要欄を取得していく53 shadow_host = driver.find_element(:xpath, "//*[@id='item-info']/section[2]/mer-show-more")54 shadow_root = shadow_host.shadow_root55 # 概要欄を取得56 content = shadow_root.find_element(:css, '.content').text57rescue Selenium::WebDriver::Error::NoSuchElementError58 p 'no such element error!!'59 return60end61puts content62# 売り切れかどうか判断する処理63begin64 # 売り切れステッカーを取得65 shadow_host = driver.find_element(:xpath, "//*[@id='item-info']/section[1]/div[2]/mer-button")66 shadow_root = shadow_host.shadow_root67 status_text = shadow_root.find_element(:css, '.button').text68 if status_text == "売り切れました"69 status = '売り切れ'70 else71 status = '販売中'72 end73rescue Selenium::WebDriver::Error::NoSuchElementError74 p 'no such element error!!'75 return76end77puts status78#検索結果一覧へ戻る79driver.navigate.back80# ========================== ここまでが1つの処理のセット ======================================81# driverをとじる...

Full Screen

Full Screen

shadow_dom_spec.rb

Source:shadow_dom_spec.rb Github

copy

Full Screen

...15 url: 'https://ondemand.saucelabs.com/wd/hub/',16 capabilities: opts17 @driver.get('http://watir.com/examples/shadow_dom.html')18 shadow_host = @driver.find_element(css: '#shadow_host')19 shadow_root = @driver.execute_script('return arguments[0].shadowRoot', shadow_host)20 shadow_content = shadow_root.find_element(css: '#shadow_content')21 expect(shadow_content.text).to eq 'some text'22 end23 end24 context 'when new Chrome' do25 # Same code as above, but with Chromium 96+, it works in Selenium 4.1 (but not 4.0)26 it 'old code works' do27 @driver = Selenium::WebDriver.for :chrome28 @driver.get('http://watir.com/examples/shadow_dom.html')29 shadow_host = @driver.find_element(css: '#shadow_host')30 shadow_root = @driver.execute_script('return arguments[0].shadowRoot', shadow_host)31 shadow_content = shadow_root.find_element(css: '#shadow_content')32 expect(shadow_content.text).to eq 'some text'33 end34 # Please use this code35 it 'recommended code' do36 @driver = Selenium::WebDriver.for :chrome37 @driver.get('http://watir.com/examples/shadow_dom.html')38 shadow_host = @driver.find_element(css: '#shadow_host')39 shadow_root = shadow_host.shadow_root40 shadow_content = shadow_root.find_element(css: '#shadow_content')41 expect(shadow_content.text).to eq 'some text'42 end43 end44 context 'when Firefox' do45 # Firefox is special46 it 'workaround' do47 @driver = Selenium::WebDriver.for :firefox48 @driver.get('http://watir.com/examples/shadow_dom.html')49 shadow_host = @driver.find_element(css: '#shadow_host')50 children = @driver.execute_script('return arguments[0].shadowRoot.children', shadow_host)51 shadow_content = children.first { |child| child.attribute('id') == 'shadow_content' }52 expect(shadow_content.text).to eq 'some text'53 end54 end...

Full Screen

Full Screen

shadowdom.rb

Source:shadowdom.rb Github

copy

Full Screen

1# frozen_string_literal: true2require_relative "node/shadow_root"3require_relative "shadow_dom/version"4module Capybara5 module ShadowDOM6 ROOT_KEY = "shadow-6066-11e4-a52e-4f735466cecf"7 # Adds a way to retrieve the shadow root object of an element. For example, given the HTML below:8 #9 # <awesome-element>10 # <!-- #shadow-root start -->11 # <span>Hello shadow world!</span>12 #13 # <input type="text" id="user_name">14 # <!-- #shadow-root end -->15 # </awesome-element>16 #17 # Then You will be able to do:18 #19 # within custom_element.shadow_root do20 # # Displays "Hello shadow world!":21 # puts page.text22 #23 # # Asserts the text within the element:24 # assert_text "Hello shadow world!"25 #26 # # Input elements within the shadow DOM will also be accessible:27 # fill_in "#user_name", with: "awesome@example.org"28 # end29 #30 def shadow_root31 root_node = evaluate_script("this.shadowRoot")32 return if root_node.nil?33 node = if defined?(::Selenium::WebDriver::ShadowRoot) && root_node.is_a?(::Selenium::WebDriver::ShadowRoot)34 # Selenium >= 4.1.x35 driver.send(:build_node, root_node)36 elsif root_node.is_a?(Hash)37 bridge = session.driver.browser.send(:bridge)38 shadow_key = if defined?(::Selenium::WebDriver::ShadowRoot)39 # Selenium ~> 4.0.x40 ::Selenium::WebDriver::ShadowRoot::ROOT_KEY41 else42 # Selenium ~> 3.x43 ROOT_KEY44 end...

Full Screen

Full Screen

shadow_root

Using AI Code Generation

copy

Full Screen

1search_button = shadow_root.find_element(:css, "button")2shadow_root = driver.execute_script('return arguments[0].shadowRoot', driver.find_element(:css, 'custom-button'))3search_button = shadow_root.find_element(:css, "button")4shadow_root = driver.execute_script('return arguments[0].shadowRoot', driver.find_element(:css, 'custom-button'))5search_button = shadow_root.find_element(:xpath, "//button")

Full Screen

Full Screen

shadow_root

Using AI Code Generation

copy

Full Screen

1input = driver.find_element(:name, 'q')2button = driver.find_element(:name, 'btnG')3link = driver.find_element(:link_text, 'Selenium WebDriver')4shadow_root = driver.execute_script("return arguments[0].shadowRoot", link)5shadow_root.find_element(:link_text, 'Selenium WebDriver').click

Full Screen

Full Screen

shadow_root

Using AI Code Generation

copy

Full Screen

1shadow_root = driver.find_element(:tag_name, 'my-element').shadow_root2input = shadow_root.find_element(:tag_name, 'input')3function myFunction() {4 var x = document.createElement("INPUT");5 x.setAttribute("type", "text");6 x.setAttribute("value", "Hello World!");7 document.body.appendChild(x);8}9< button onclick="myFunction()" >Try it< /button >10class MyElement extends HTMLElement {11 constructor() {12 super();13 const shadow = this.attachShadow({mode: 'open'});14 const wrapper = document.createElement('span');15 wrapper.setAttribute('class', 'wrapper');16 const text = document.createElement('slot');17 text.setAttribute('name', 'text');18 const style = document.createElement('style');19 .wrapper {20 position: relative;21 }22 input {23 position: absolute;24 top: 0;25 left: 0;26 border: none;27 font: inherit;28 width: 100%;29 padding: 0.6em 0.75em;30 border-bottom: 0.25em solid transparent;31 }32 input:focus {33 outline: 0;34 border-bottom-color: currentColor;35 }36 `;37 shadow.appendChild(style);38 shadow.appendChild(wrapper);39 wrapper.appendChild(text);40 wrapper.appendChild(document.createElement('br'));41 const input = document.createElement('input

Full Screen

Full Screen

shadow_root

Using AI Code Generation

copy

Full Screen

1shadow_root = driver.shadow_root(driver.find_element(tag_name: 'my-element'))2puts shadow_root.find_element(id: 'myId').text3shadow_root = driver.find_element(tag_name: 'my-element').shadow_root4puts shadow_root.find_element(id: 'myId').text5shadow_root = driver.find_element(tag_name: 'my-element').shadow_root6puts shadow_root.find_element(id: 'myId').text7shadow_root = driver.find_element(tag_name: 'my-element').shadow_root

Full Screen

Full Screen

Automation Testing Tutorials

Learn to execute automation testing from scratch with LambdaTest Learning Hub. Right from setting up the prerequisites to run your first automation test, to following best practices and diving deeper into advanced test scenarios. LambdaTest Learning Hubs compile a list of step-by-step guides to help you be proficient with different test automation frameworks i.e. Selenium, Cypress, TestNG etc.

LambdaTest Learning Hubs:

YouTube

You could also refer to video tutorials over LambdaTest YouTube channel to get step by step demonstration from industry experts.

Run Selenium automation tests on LambdaTest cloud grid

Perform automation testing on 3000+ real desktop and mobile devices online.

Most used method in

Try LambdaTest Now !!

Get 100 minutes of automation test minutes FREE!!

Next-Gen App & Browser Testing Cloud

Was this article helpful?

Helpful

NotHelpful