v1.10.0: New Compiler Options API, Resize and Screenshot Support for Child Windows

…and the selector API for shadow DOM access, plus multiple bugfixes.

Enhancements

Window Resize and Screenshot Support for Child Windows in Chrome (PR #5661, PR #5567)

You can now use the following actions in Google Chrome when you switch the test context to a child window:

New API to Specify Compiler Options (#5519)

In previous versions, you used the following methods to specify TypeScript compiler options:

  • the --ts-config-path command line flag

    testcafe chrome my-tests --ts-config-path path/to/config.json

  • the runner.tsConfigPath method

    runner.tsConfigPath('path/to/config.json');

  • the tsConfigPath configuration file property

    {
    "tsConfigPath": "path/to/config.json"
}

In v1.10.0, we introduced a new easy-to-use API that allows you to specify the compiler options in the command line, API or TestCafe configuration file, without creating a separate JSON file. The new API is also designed to accept options for more compilers (for instance, Babel) in future releases.

The API consists of the following members:

  • the --compiler-options command line flag

    testcafe chrome my-tests --compiler-options typescript.experimentalDecorators=true

  • the runner.compilerOptions method

    runner.compilerOptions({
    typescript: {
        experimentalDecorators: true
    }
});

  • the compilerOptions configuration file property

    {
    "compilerOptions": {
        "typescript": {
            "experimentalDecorators": true
        }
    }
}

If you prefer to keep compiler settings in a configuration file, you can use the new API to specify the path to this file:

testcafe chrome my-tests --compiler-options typescript.configPath='path/to/config.json'

In v1.10.0, you can customize TypeScript compiler options only.

For more information, see TypeScript and CoffeeScript.

Added a Selector Method to Access Shadow DOM (PR #5560 by @mostlyfabulous)

This release introduces the selector.shadowRoot method that allows you to access and interact with the shadow DOM elements. This method returns a shadow DOM root hosted in the selector’s matched element.

import { Selector } from 'testcafe'

fixture `Target Shadow DOM elements`
    .page('https://devexpress.github.io/testcafe/example')

test('Get text within shadow tree', async t => {
    const shadowRoot = Selector('div').withAttribute('id', 'shadow-host').shadowRoot();
    const paragraph  = shadowRoot.child('p');

    await t.expect(paragraph.textContent).eql('This paragraph is in the shadow tree');
});

Note that you should chain other selector methods to selector.shadowRoot to access elements in the shadow DOM. You cannot interact with the root element (an error occurs if you specify selector.shadowRoot as an action’s target element).

Bug Fixes

  • Browsers now restart correctly on BrowserStack when the connection is lost (#5238)
  • Fixed an error that occurs if a child window is opened in an iframe (#5033)
  • TestCafe can now switch between the child and parent windows after the parent window is reloaded (#5463, #5597)
  • Fixed an issue when touch and mouse events fired on mobile devices even though the mouse event was prevented in page code (#5380)
  • Cross-domain iframes are now focused correctly in Safari (#4793)
  • Fixed an excessive warning displayed when an assertion is executed in a loop or against an element returned by a selector.xxxSibling method (#5449, #5389)
  • Cross-domain iframe source links now have the correct protocol when SSL is used (PR testcafe-hammerhead/#2478)
  • A page error is no longer emitted if the destination server responded with the 304 status (#5025)
  • Fixed an issue when TestCafe could not authenticate websites that use MSAL (#4834)
  • The srcdoc attributes for iframes are now processed
  • The authorization header is now preserved in response headers of fetch requests
  • The document.title for an iframe without src can now be correctly obtained in Firefox (PR testcafe-hammerhead/#2466)
  • TestCafe UI is now displayed correctly if the tested page’s body content is added dynamically (PR testcafe-hammerhead/#2454)
  • Service Workers now receive fetch events
  • Fixed the case of headers sent to the web app server
  • Location objects in iframes without src now contain the correct data (PR testcafe-hammerhead/#2448)
  • Native function wrappers are now converted to strings correctly