Runner.clientScripts Method

Injects scripts into pages visited during the tests. Use this method to introduce client-side mock functions or helper scripts.

async clientScripts( script[, script2[, ...[, scriptN]]] ) → this

Parameter	Type	Description
`script`, `script2`, `scriptN`	String \| Object \| Array	Scripts to inject into the tested pages.

Inject a JavaScript File

Specify the JavaScript file path to inject the content of this file into the tested pages. You can pass a string or object with the path property.

runner.clientScripts(filePath | { path: filePath })
runner.clientScripts(filePath | { path: filePath }, ...)
runner.clientScripts([ filePath | { path: filePath } ])

Argument	Type	Description
`filePath`	String	The path to the JavaScript file whose content should be injected.

Note

You cannot combine the path, module and content properties in a single object. To inject multiple items, pass several arguments or an array.

TestCafe resolves relative paths against the current working directory.

Example

runner.clientScripts('assets/jquery.js');
// or
runner.clientScripts({ path: 'assets/jquery.js' });

Inject a Module

Specify the Node.js module’s name to inject its content into the tested pages. Use an object with the module property.

runner.clientScripts( { module: moduleName } )
runner.clientScripts( { module: moduleName }, ... )
runner.clientScripts([ { module: moduleName } ])

Argument	Type	Description
`moduleName`	String	The module name.

Note

You cannot combine the module, path and content properties in a single object. To inject multiple items, pass several arguments or an array.

TestCafe uses Node.js mechanisms to search for the module’s entry point and injects its content into the tested page.

The browser must be able to execute the injected module. For example, modules that implement the UMD API can run in most modern browsers.

Note

If the injected module has dependencies, ensure that the dependencies can be loaded as global variables and these variables are initialized in the page’s code.

Example

runner.clientScripts({ module: 'lodash' });

Inject Script Code

You can pass an object with the content property to provide the injected script as a string.

runner.clientScripts({ content: code })
runner.clientScripts({ content: code }, ...)
runner.clientScripts([ { content: code } ])

Argument	Type	Description
`code`	String	JavaScript that should be injected.

Note

You cannot combine the content, path and module properties in a single object. To inject multiple items, pass several arguments or an array.

Example

const mockDate = `
    Date.prototype.getTime = function () {
        return 42;
    };
`;

runner.clientScripts({ content: mockDate });

Provide Scripts for Specific Pages

You can also specify pages into which a script should be injected. This will allow you to mock browser API on specified pages and use the default behavior everywhere else.

To specify target pages for a script, add the page property to the object you pass to clientScripts.

runner.clientScripts({
    page: url,
    path: filePath | module: moduleName | content: code
})

runner.clientScripts({
    page: url,
    path: filePath | module: moduleName | content: code
}, ...)

runner.clientScripts([
    {
        page: url,
        path: filePath | module: moduleName | content: code
    }
])

Property	Type	Description
`url`	String \| RegExp	Specify a page URL to add scripts to a page, or a regular expression to add scripts to pages whose URLs match this expression.

Note

If the target page redirects to a different URL, ensure that the page property matches the destination URL. Otherwise, scripts are not injected.

Example

runner.clientScripts({
    page: /\/user\/profile\//,
    path: 'dist/jquery.js'
});

The fixture.clientScripts and test.clientScripts methods allow you to inject scripts into pages visited during an individual fixture or test.

See Inject Scripts into Tested Pages for more information.

Related configuration file property: clientScripts