Automated UI testing with PyChromeDevTools

While developing the UI for your game or application, there will always be a need to debug it to find the reason for any potential issues or test it to ensure its correctness during the development cycle.

Debugging the UI using the Google Chrome Dev tool is covered in the “Debugging and profiling” section(https://coherentlabs.zendesk.com/hc/en-us/community/topics/5483867380753-Debugging-and-profiling ), so in this post, we will share how you can automate this process.

For the automatic testing of the UI, similar to how the browsers do it with the Selenium framework(https://www.selenium.dev/ ), you can use the PyChromeDevTools python module(https://github.com/marty90/PyChromeDevTools ) and directly access the Chrome Dev Tools Protocol(https://chromedevtools.github.io/devtools-protocol/). The Chrome Dev Tools protocol provides a robust set of tools and functionalities that enable developers to interact with and control the UI running in the game programmatically. With this API, you can automate UI tasks, analyze DOM state, debug JavaScript, profile performance, and much more.

The usage is as simple as:

1. Install PyChromeDevTools using the following pip command:
   

   sudo pip3 install PyChromeDevTools

2. Create a Python script and init the Chrome interface:
   

   chrome = PyChromeDevTools.ChromeInterface("localhost", 9444)
   // The second argument must be the Debugger port set for Gameface

3. Enable the desired API from the DevToolsProtocol (e.g., DOM access):
   

   chrome.DOM.enable()

4. Utilize the Chrome Dev APIs and extract the necessary information from the loaded HTML page to ensure its correct behavior:
   

   // e.g. print the DOM object
   print(chrome.DOM.getDocument());  

From this link(click here), you can access the "PyChromeDevTools API.pdf" document, which contains comprehensive information about the Chrome Dev Tools protocol and the corresponding API supported by our tech. We hope the document proves to be an invaluable resource for your development endeavors. If you have any questions or need further assistance, please don't hesitate to contact our support team. We are always here to help you make the most of the Chrome Dev Tools protocol.

Happy coding and automating!