Chrome Devtools Protocol via Selenium/Appium (Japanese)
0 likes878 views
This document discusses using the Chrome DevTools Protocol (CDP) via Selenium and Appium to control and inspect Chrome and Android Chrome browsers. It provides examples of executing CDP commands through Selenium for Chrome on desktop and through Appium for Android Chrome. The CDP allows programs to remotely control and inspect browser activity and state.
![WebSocket
=> {"id":1,"method":"Network.enable","params":{"maxPostDataSize":65536}}
=> {"id":2,"method":"Page.enable"}
=> {"id":3,"method":"Page.getResourceTree"}
=> {"id":4,"method":"Runtime.enable"}
=> {"id":5,"method":"Debugger.enable","params":{"maxScriptsCacheSize":10000000}}
=> {"id":6,"method":"Debugger.setPauseOnExceptions","params":{"state":"none"}}
=> {"id":7,"method":"Debugger.setAsyncCallStackDepth","params":{"maxDepth":32}}
=> {"id":8,"method":"Profiler.enable"}
=> {"id":9,"method":"Log.enable"}
=> {"id":10,"method":"Log.startViolationsReport","params":{"config":[{"name":"longTask","threshold":200},
{"name":"longLayout","threshold":30},{"name":"blockedEvent","threshold":100},{"name":"blockedParser","threshold":-1},
{"name":"handler","threshold":150},{"name":"recurringHandler","threshold":50},
{"name":"discouragedAPIUse","threshold":-1}]}}
=> {"id":11,"method":"DOM.enable"}
=> {"id":12,"method":"CSS.enable"}
=> {"id":13,"method":"Overlay.enable"}
….](https://image.slidesharecdn.com/20200516-cdp-selenium-200516093837/85/Chrome-Devtools-Protocol-via-Selenium-Appium-Japanese-8-320.jpg)
![Appium
[HTTP] --> POST /wd/hub/session/11d6751a-def1-4a1d-a401-2d928bdf3065/goog/cdp/execute
[HTTP] {"cmd":"Browser.getVersion","params":{}}
[W3C (11d6751a)] Driver proxy active, passing request on via HTTP proxy
[debug] [WD Proxy] Matched '/wd/hub/session/11d6751a-def1-4a1d-a401-2d928bdf3065/goog/cdp/execute' to
command name 'executeCdp'
[debug] [WD Proxy] Proxying [POST /wd/hub/session/11d6751a-def1-4a1d-a401-2d928bdf3065/goog/cdp/
execute] to [POST http://127.0.0.1:8000/wd/hub/session/d54ca3ff98f09fa0a4c11ce14705b9e1/goog/cdp/
execute] with body: {"cmd":"Browser.getVersion","params":{}}
[debug] [WD Proxy] Got response with status 200:
{"sessionId":"d54ca3ff98f09fa0a4c11ce14705b9e1","status":0,"value":{"jsVersion":"6.9.427.23","product":"Chrome/
69.0.3497.100","protocolVersion":"1.3","revision":"@8920e690dd011895672947112477d10d5c8afb09","userAgent":"
Mozilla/5.0 (Linux; Android 9; Android SDK built for x86_64 Build/PSR1.180720.093) AppleWebKit/537.36 (KHTML,
like Gecko) Chrome/69.0.3497.100 Mobile Safari/537.36"}}
[WD Proxy] Replacing sessionId d54ca3ff98f09fa0a4c11ce14705b9e1 with 11d6751a-def1-4a1d-
a401-2d928bdf3065
[HTTP] <-- POST /wd/hub/session/11d6751a-def1-4a1d-a401-2d928bdf3065/goog/cdp/execute 200 411 ms - 388
[HTTP]](https://image.slidesharecdn.com/20200516-cdp-selenium-200516093837/85/Chrome-Devtools-Protocol-via-Selenium-Appium-Japanese-26-320.jpg)
Chrome Devtools Protocol via Selenium/Appium (Japanese)
- 1. Chrome DevTools Protocol via Selenium 5 Selenium
- 2. • / Kazuaki Matsuo, KazuCocoa • HeadSpin, Inc. • Senior Software Engineer, Device Automation • ex-Cookpad ACCESS • https://www.headspin.io/ • OSS • Appium project
- 3. • Chrome DevTools Protocol • https://chromedevtools.github.io/devtools-protocol/ • Chrome DevTools Protocol via Selenium/Appium
- 4. • Chrome DevTools Protocol • https://chromedevtools.github.io/devtools-protocol/ • Chrome DevTools Protocol via Selenium/Appium
- 5. Chrome DevTools Protocol • Google Chrome browser • https://developers.google.com/web/tools/chrome-devtools/ • ( Chrome )
- 8. WebSocket => {"id":1,"method":"Network.enable","params":{"maxPostDataSize":65536}} => {"id":2,"method":"Page.enable"} => {"id":3,"method":"Page.getResourceTree"} => {"id":4,"method":"Runtime.enable"} => {"id":5,"method":"Debugger.enable","params":{"maxScriptsCacheSize":10000000}} => {"id":6,"method":"Debugger.setPauseOnExceptions","params":{"state":"none"}} => {"id":7,"method":"Debugger.setAsyncCallStackDepth","params":{"maxDepth":32}} => {"id":8,"method":"Profiler.enable"} => {"id":9,"method":"Log.enable"} => {"id":10,"method":"Log.startViolationsReport","params":{"config":[{"name":"longTask","threshold":200}, {"name":"longLayout","threshold":30},{"name":"blockedEvent","threshold":100},{"name":"blockedParser","threshold":-1}, {"name":"handler","threshold":150},{"name":"recurringHandler","threshold":50}, {"name":"discouragedAPIUse","threshold":-1}]}} => {"id":11,"method":"DOM.enable"} => {"id":12,"method":"CSS.enable"} => {"id":13,"method":"Overlay.enable"} ….
- 9. CDP • Google Chrome browser • https://developers.google.com/web/tools/chrome-devtools/ • ( Chrome )
- 10. • ” ” • Pupetter • https://github.com/addyosmani/puppeteer-webperf • HeadSpin • CDP … • JS
- 11. • Chrome DevTools Protocol • https://chromedevtools.github.io/devtools-protocol/ • Chrome DevTools Protocol via Selenium/Appium
- 12. Chrome Devtools via Selenium https://source.chromium.org/chromium/chromium/src/+/master:chrome/test/chromedriver/server/http_handler.cc;l=885?q=%2Fcdp%2Fexecute&ss=chromium&originalUrl=https:%2F
- 13. CDP via Selenium ChromeDriver port: 9515 Selenium clients : POST, /session/{session-id}/goog/cdp/execute
- 14. CDP via Selenium ChromeDriver port: 9515 Selenium clients : POST, /session/{session-id}/goog/cdp/execute ChromeDriver remote-debugger-address
- 15. CDP Selenium
- 16. > driver = Selenium::WebDriver.for :chrome, url: 'http://localhost:9515' => #<Selenium::WebDriver::Chrome::Driver:0x4d11f74261f6ab42 browser=:chrome> > driver.get 'http://youtube.com' => nil > driver.execute_cdp 'Browser.getVersion' => {"jsVersion"=>"8.1.307.32", "product"=>"Chrome/81.0.4044.138", "protocolVersion"=>"1.3", "revision"=>"@8c6c7ba89cc9453625af54f11fd83179e23450fa", "userAgent"=> "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Safari/537.36”} > driver.execute_cdp ‘Page.navigate’, { url: ‘http://www.selenium.jp/’ }
- 17. remote-debugger-address …? ChromeDriver port: 9515 Selenium clients : POST, /session/{session-id}/goog/cdp/execute ChromeDriver remote-debugger-address
- 19. -remote-debugger-address > driver.session_storage => #<Selenium::WebDriver::HTML5::SessionStorage:0x00007fcf3802a418 @bridge= #<Selenium::WebDriver::Remote::W3C::Bridge:0x00007fcf6010bd50 @browser=:chrome, @capabilities= #<Selenium::WebDriver::Remote::W3C::Capabilities:0x00007fcf6010bdc8 @capabilities= {:proxy=>nil, :browser_name=>"chrome", …… {"chromedriverVersion"=> "80.0.3987.106 (f68069574609230cf9b635cd784cfb1bf81bb53a-refs/branch-heads/3987@{#882})", "userDataDir"=> "/var/folders/34/2222sh8n27d6rcp7jqlkw8km0000gn/T/.com.google.Chrome.N74Q8x"}, "goog:chromeOptions"=>{"debuggerAddress"=>"localhost:53224"}, "networkConnectionEnabled"=>false, "setWindowRect"=>true, "strictFileInteractability"=>false, "unhandledPromptBehavior"=>"dismiss and notify"}>, @file_detector=nil,
- 20. CURL • CURL Selenium • curl -X POST http://localhost:9515/session/{session_id}/goog/cdp/execute -d '{"cmd": "Browser.getVersion", "params": {}}’ • ‘goog’ vendor • MicrosoftEdge ’ms’ • webdriverio Pupetter
- 21. CURL CDP
- 22. CURL curl -X POST http://localhost:9515/session/{session_id}/goog/cdp/execute -d '{"cmd": "Browser.getVersion", "params": {}}’ > {"value":{"jsVersion":"8.1.307.32","product":"Chrome/ 81.0.4044.138","protocolVersion":"1.3","revision":"@8c6c7ba89cc9453625af54f11fd83179e23450fa","userAgent":"Mozilla/5.0 (Macintos Mac OS X 10_15_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Safari/537.36”}}
- 24. Android Chrome • Appium CDP Chrome • Appium 1.18.0
- 25. require 'appium_lib_core' @core = Appium::Core.for url: 'http://localhost:4723/wd/hub', desired_capabilities: { "deviceName": "Android", "automationName": "UiAutomator2", "autoAcceptsAlerts": "true", "platformName": "Android", "browserName": "chrome" } @driver = @core.start_driver @driver.execute_cdp 'Browser.getVersion' => {"jsVersion"=>"6.9.427.23", "product"=>"Chrome/69.0.3497.100", "protocolVersion"=>"1.3", "revision"=>"@8920e690dd011895672947112477d10d5c8afb09", "userAgent"=> "Mozilla/5.0 (Linux; Android 9; Android SDK built for x86_64 Build/PSR1.180720.093) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Mobile Safari/537.36"}
- 26. Appium [HTTP] --> POST /wd/hub/session/11d6751a-def1-4a1d-a401-2d928bdf3065/goog/cdp/execute [HTTP] {"cmd":"Browser.getVersion","params":{}} [W3C (11d6751a)] Driver proxy active, passing request on via HTTP proxy [debug] [WD Proxy] Matched '/wd/hub/session/11d6751a-def1-4a1d-a401-2d928bdf3065/goog/cdp/execute' to command name 'executeCdp' [debug] [WD Proxy] Proxying [POST /wd/hub/session/11d6751a-def1-4a1d-a401-2d928bdf3065/goog/cdp/ execute] to [POST http://127.0.0.1:8000/wd/hub/session/d54ca3ff98f09fa0a4c11ce14705b9e1/goog/cdp/ execute] with body: {"cmd":"Browser.getVersion","params":{}} [debug] [WD Proxy] Got response with status 200: {"sessionId":"d54ca3ff98f09fa0a4c11ce14705b9e1","status":0,"value":{"jsVersion":"6.9.427.23","product":"Chrome/ 69.0.3497.100","protocolVersion":"1.3","revision":"@8920e690dd011895672947112477d10d5c8afb09","userAgent":" Mozilla/5.0 (Linux; Android 9; Android SDK built for x86_64 Build/PSR1.180720.093) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Mobile Safari/537.36"}} [WD Proxy] Replacing sessionId d54ca3ff98f09fa0a4c11ce14705b9e1 with 11d6751a-def1-4a1d- a401-2d928bdf3065 [HTTP] <-- POST /wd/hub/session/11d6751a-def1-4a1d-a401-2d928bdf3065/goog/cdp/execute 200 411 ms - 388 [HTTP]
- 27. • Chrome DevTools Protocol • Chrome DevTools Protocol via Selenium/Appium
- 28. : playwright • pipe Chrome CDP • https://github.com/microsoft/playwright/blob/master/src/server/ chromium.ts#L177 • https://github.com/microsoft/playwright/tree/master/ browser_patches