I want to share the solution I discovered here that helped me successfully run Protractor using a file protocol.
Protractor by default uses
data:text/html,<html></html>
as the resetUrl. However, there may be restrictions when transitioning from the data: to the file: protocol, resulting in a "not allowed local resource" error. To address this, we need to replace the resetUrl with one using the file: protocol:
exports.config = {
// ...
baseUrl: 'file:///absolute/path/to/your/project/index.html',
onPrepare: function() {
// By default, Protractor uses data:text/html,<html></html> as resetUrl, but
// location.replace from the data: to the file: protocol is not allowed
// (we'll get ‘not allowed local resource’ error), so we replace resetUrl with one
// with the file: protocol (this particular one will open system's root folder)
browser.resetUrl = 'file://';
}
// ...
};
If you wish to use a relative path to your project folder, Node.js tools can be helpful since Protractor operates within a Node.js environment. For instance, using __dirname will provide an absolute path to the directory where your Protractor config file is located. Consequently, you can use:
exports.config = {
// ...
baseUrl: 'file://' + __dirname + '/spec/support/index.html'
// ...
};
In cases where your application makes XHR requests to endpoints that are restricted under the file: protocol, running your test browser with custom flags might be necessary. For example, in my scenario with Chrome:
exports.config = {
// ...
capabilities: {
browserName: 'chrome',
chromeOptions: {
// --allow-file-access-from-files - allow XHR from file://
args: ['allow-file-access-from-files']
}
}
// ...
}