September 2024 Summaries

Fixtures are a powerful tool in Playwright projects that enable clean testing by hiding setup instructions from test cases. By combining fixtures with page object models, developers can keep their tests clean and focused on testing features. However, if additional configuration is needed for page object models, it can be challenging to pass options to the fixtures. To address this, developers can extend Playwright's core functionality by importing and renaming `test`, adding custom functionality, and exporting the returned value as `test`. This allows for configurable fixtures that can be accessed by both tests and fixtures, making it easier to manage complex projects with multiple users or settings. By establishing conventions and using fixtures and options, developers can keep their Playwright projects organized and maintainable.

You can attach screenshots directly to Playwright's test reports using the `testInfo.attach()` method. This allows you to centralize all your screenshots, SVGs, or other files in one place within your report, decluttering your repository and providing a more integrated view of your test results. By attaching your screenshots, you can easily access them right from the report, making it convenient for uploading to CI/CD pipelines. The approach is not limited to screenshots and can be applied to attachments like JSON files or other data formats.

To detect broken links on a website using Playwright and Checkly, one can extract all link URLs from a page, make requests to these URLs, and evaluate their status code. The process involves several steps, including extracting the `href` attribute value from all links, saving requests and removing duplicate link targets, normalizing local link targets to absolute URLs, and checking for broken link URLs. This can be done using Playwright's lazy locator behavior, native JavaScript features such as sets and URL constructors, and soft assertions to collect errors without stopping the test case. The final implementation can be found on GitHub, allowing users to run Playwright in their CICD pipeline and check for broken links whenever they deploy their sites.

The Node.js runtime doesn't implement the Happy Eyeballs algorithm for web requests by default, which can lead to issues when a server has a broken IPv6 address that responds first. This was discovered during testing of the Checkly Coralogix integration, where users in the US-East-1 region were experiencing failures due to the Node.js runtime's preference for IPv4 over IPv6. The issue was traced back to an unexpected behavior in Node.js 18 and earlier versions, which look up both IPv4 and IPv6 numbers separately and prefer the first one that responds. This can lead to issues when the faster of the two connections isn't returned, as the slower one will be used instead. The problem was solved by configuring requests to prioritize IPv6 over IPv4, which is now supported in the API checks of Checkly.