guys. I'm trying to set up e2e testing using Playwright. I'm following along these steps (enter link description here) and I can see the tests are passing but I'd like to see the browser window so I can try and interact with the elements. How can I make the test runner open a browser window or tab?
You could either use the Debug mode by adding --debug to you command e.g.:
npx playwright test example --debug
This allows you to Debug through your Tests step by step.
Or you can change your config to run in headed mode by setting
headless:false
In you playwright.config.ts
You can have a global configuration file called playwright.config.ts which goes in project root, a basic example of which looks like below. Note the headless: false in the 'use' section. Change the 'baseURL' to what you want to test.
// playwright.config.ts
import { PlaywrightTestConfig } from '#playwright/test';
const config: PlaywrightTestConfig = {
reporter: [['list'], ['html', { open: 'never' }]],
workers: 1,
use: {
baseURL: http://playwright.dev,
headless: false,
},
projects: [
{
name: 'chromium',
use: {
browserName: 'chromium',
},
},
],
};
export default config;
In your test, because you have a baseURL set in config, you just need to call the following to navigate to that url:
// mytest.spec.ts
import { test } from '#playwright/test';
test('Do something...', async ({ page }) => {
await page.goto('');
});
Related
I am trying to migrate my test from Cypress 8.7.0 version to Cypress 10.10.0 version. Installed the latest version and did the below settings, but getting below error.
Using below versions:
Cypress 10.10.0,
"#badeball/cypress-cucumber-preprocessor": "^11.4.0",
node v18.4.0,
#bahmutov/cypress-esbuild-preprocessor": "^2.1.5"
Expected to find a global registry (this usually means you are trying to define steps or hooks in support/e2e.js, which is not supported) (this might be a bug, please report at https://github.com/badeball/cypress-cucumber-preprocessor)
Because this error occurred during a before each hook we are skipping all of the remaining tests.
I have added the error handling in e2e.js file and support/index.js file but still could not resolve this issue. I have .env file which has the environment variable in my root location. Could someone please advise on this issue ?
//Detail error log:
Because this error occurred during a `before each` hook we are skipping all of the remaining tests.
at fail (tests?p=tests/cypress/e2e/login/loginBase.feature:964:15)
at assert (tests?p=tests/cypress/e2e/login/loginBase.feature:971:9)
at assertAndReturn (tests?p=tests/cypress/e2e/login/loginBase.feature:975:9)
at getRegistry (tests?
Cypress version : v10.10.0
//tests/cypress/e2e/login/login.feature
#regression
#login
Feature: Login to base url
Scenario: Login to base url
Given I go to base url
//step defintion:
tests/cypress/stepDefinitions/login.cy.js
import { Given, When, Then, Before, After, And } from "#badeball/cypress-cucumber-preprocessor";
When('I go to base url', () => {
cy.visit(Cypress.config().baseUrl);
})
// tests/cypress/support/index.js file
// Import commands.js using ES2015 syntax:
import './commands'
Cypress.on('uncaught:exception', (err, runnable) => {
// returning false here prevents Cypress from
// failing the test
return false
});
//tests/cypress/support/e2e.js
// Import commands.js using ES2015 syntax:
import './commands'
Cypress.on('uncaught:exception', (err, runnable) => {
// returning false here prevents Cypress from
// failing the test
return false
})
//.cypress-cucumber-preprocessorrc.json // add this file in project root location
{
"stepDefinitions": [
"[filepath].{js,ts}",
"tests/cypress/stepDefinitions/**/*.{js,ts}"
]
}
// cypress.config.js
const { defineConfig } = require('cypress')
const createBundler = require("#bahmutov/cypress-esbuild-preprocessor");
const addCucumberPreprocessorPlugin = require("#badeball/cypress-cucumber-preprocessor")
const createEsbuildPlugin = require("#badeball/cypress-cucumber-preprocessor/esbuild").createEsbuildPlugin;
const dotenvPlugin = require('cypress-dotenv');
async function setupNodeEvents(on, config) {
await addCucumberPreprocessorPlugin.addCucumberPreprocessorPlugin(on, config);
on(
"file:preprocessor",
createBundler({
plugins: [createEsbuildPlugin(config)],
})
);
//webpack config goes here if required
config = dotenvPlugin(config)
return config;
}
module.exports = defineConfig({
e2e: {
baseUrl: 'https://bookmain.co',
apiUrl: 'https://bookmain.co/api/books/',
specPattern: "tests/cypress/e2e/**/*.feature",
supportFile: false,
setupNodeEvents
},
component: {
devServer: {
framework: "next",
bundler: "webpack",
},
},
});
// package.json
"cypress-cucumber-preprocessor": {
"nonGlobalStepDefinitions": true,
"stepDefinitions": "tests/cypress/stepDefinitions/**/*.{js,ts}",
"cucumberJson": {
"generate": true,
"outputFolder": "tests/cypress/cucumber-json",
"filePrefix": "",
"fileSuffix": ".cucumber"
}
},
In cypress.config.js add the following:
const {dotenvPlugin} = require('cypress-dotenv');
module.exports = (on, config) => {
config = dotenvPlugin(config)
return config
}
This will resolve the issue.
I have a set of e2e tests.
We have a test enviroment: test.mypage.com
And we also have a UAT enviroment: uat.mypage.com
I want to be able to run the same e2e tests on either our test or uat enviroment, depending on the command line i use.
my config file:
import { LaunchOptions } from 'playwright';
const browserOptions: LaunchOptions = {
headless: false,
slowMo: 0,
args: []
};
export const config = {
browserOptions,
env: {
server: 'test'
}
};
my step file:
Given(/^i go to login page$/, async function () {
await PW.page.goto(`https://${config.env.server}.mypage.com/`);
});
the command line I use to run my tests:
npx cucumber-js
So I assume the solution would be something like
npx cucumber-js --server "uat"
but either my syntax is wrong or I'm missing something. When I run the script above, I get an error: unknown option: '--server'.
I tried
npx cucumber-js `$env:server="uat"
which didn't throw any errors but the environment remained test.mypage.com.
So how can I change the environment from the command line?
You can use the baseurl test option for this.
In your config file, add the baseurl:
import { PlaywrightTestConfig } from '#playwright/test';
const config: PlaywrightTestConfig = {
use: {
baseURL: `https://${config.env.server}.mypage.com/`,
},
};
export default config;
So now your test should look like this:
Given(/^i go to login page$/, async function () {
await PW.page.goto('/');
});
Now from CLI, you can run with a different baseurl like this:
URL=https://playwright.dev npx playwright test
My protractor tests work correctly on my machine but when start it on Azure pipeline all tests fail with No element found.
Do you have an idea wwhat is the problem
May be i miss something here.That is in my conf.js:
browser.ignoreSynchronization = false;
exports.config = {
allScriptsTimeout: 500000,
// getPageTimeout: 15000,
specs: ['specDAC.js'],
rootElement: 'html',
capabilities: {
'browserName': 'chrome',
chromeOptions: {
args: ["--headless", "--disable-gpu", "--window-size=1200,900"],
binary: process.env.CHROME_BIN
}
},
directConnect: true,
baseUrl: 'http://localhost:4200/',
framework: 'jasmine',
jasmineNodeOpts: {
showColors: true,
defaultTimeoutInterval: 1000000,
Usually when I see 'element not found' it's typically signalizing that the page/AUT is not even loaded. It's hard to say without seeing actual code but I can assume that your test starts with navigating to some page. Try add some logging or wrap this part in to condition (e.g If 'login' button is present => click; else => console.log("something wrong")
The problem is not in the code. The test is work on my machine. The problem is something in the pipeline or in conf.js. The pipeline cannot find any elements. The page is loaded i put an average waiting time.
Ok may be you are right. That is my code you can check it:
it('first test', async function(){
await sleep(2000);
await browser.driver.manage().window().maximize();
await browser.waitForAngularEnabled(false);
await sleep(8000);
// login user
await loginPage.get(testConf.loginUrl);
await sleep(4000);
await loginPage.setLoginCredentials(testConf.mmmClientUser, testConf.password);
The error is not find an element where put my email but locally it is work
I've tried setting up a minimal test demonstration, but I'm stuck when I try to run tests.
What I get is:
Listening on 0.0.0.0:9000
Starting tunnel...
Error: Failed to load module request from /tmp/local-selenium-intern/request.js (parent: tests/functional)
at <node_modules/intern/node_modules/dojo/dojo.js:757:12>
at <fs.js:207:20>
at Object.oncomplete <fs.js:107:15>
What I expect is that internal modules (such as request doesn't require any explicit configuration for them to load correctly).
I have this test configuration:
define({
proxyPort: 9000,
proxyUrl: 'http://localhost:9000/',
capabilities: {
'selenium-version': '2.35.0',
'idle-timeout': 30
},
environments: [
{ browserName: 'firefox' },
{ browserName: 'chrome' }
],
maxConcurrency: 3,
useSauceConnect: false,
webdriver: {
host: 'localhost',
port: 4444
},
loader: {
// TODO: What to add here?
},
suites: [ 'tests/unit' ],
functionalSuites: [ 'tests/functional' ],
excludeInstrumentation: /^(?:tests|node_modules)\//
});
tests/functional.js contains this:
'use strict';
define([
'intern!object',
'intern/chai!assert',
'request'
], function (registerSuite, assert, request) {
registerSuite({
name: 'async demo',
'async test': function () {
var dfd = this.async(1000);
request('http://example.com/test.json').then(dfd.callback(function (data) {
assert.strictEqual(data, 'Hello world!');
}), dfd.reject.bind(dfd));
}
});
});
(An example from interns own documentation.)
The example provided is very basic and can be tested by downloading the code below followed `npm install && npm start``:
https://github.com/mzedeler/local-selenium-intern/tree/request-broken
From looking at your repository, I see you fixed the issue by using the request module from Intern's copy of Dojo. While this works, it's better to use your own copy of Dojo for your tests. Intern (the non-geezer version, at least) doesn't use standard Dojo, and makes no guarantees about the functionality therein. The current release of Dojo (1.10.0) is available through the npm repository, so it's easy to include as a project dependency.
Also, the test config in your project is a bit out of date. Specifically, the webdriver and useSauceConnect options have been replaced by tunnel and tunnelOptions. More information about the changes in Intern 2 is available in the 2.0.0 release notes.
I'm trying to perform a basic functional test:
define([
'intern!object',
'intern/chai!assert',
'../Request',
'require'
], function (registerSuite, assert, Request, require) {
var request,
url = 'https://github.com/theintern/intern';
registerSuite({
name: 'demo',
'submit form': function () {
return this.remote
.get(require.toUrl('./fixture.html'))
.findById('operation')
.click()
.type('hello, world')
.end()
.findById('submit')
.click()
.end()
.setFindTimeout(Infinity)
.findById('result')
.setFindTimeout(0)
.text()
.then(function (resultText) {
assert.ok(resultText.indexOf(
'"hello, world" completed successfully') > -1,
'On form submission, operation should complete successfully');
});
}
});
});
(Example from the intern.js documentation)
https://github.com/theintern/intern/wiki/Writing-Tests-with-Intern
My intern.js configuration file is as followed:
define({
proxyPort: 9000,
proxyUrl: 'http://localhost:9000/',
capabilities: {
'selenium-version': '2.41.0'
},
environments: [
{ browserName: 'chrome'}
],
maxConcurrency: 3,
tunnel: "BrowserStackTunnel",
webdriver: {
host: 'http://hub.browserstack.com/wd/hub',
username: 'XXXXX',
accessKey: 'XXXXX'
},
useSauceConnect: false,
loader: {
packages: [
{
name: "dojo",
location: 'vendor/dojo'
}
]
},
suites: [ "tests/test" ],
excludeInstrumentation: /^(?:tests|node_modules)\//
});
When I run my test, it seems that the connection is being made with browserstack, but my test keep failing:
-> ./node_modules/.bin/intern-runner config=tests/intern
Listening on 0.0.0.0:9000
Starting tunnel...
BrowserStackLocal v2.2
Ready
Initialised chrome 35.0.1916.114 on XP
Test main - index - test FAILED on chrome 35.0.1916.114 on XP:
TypeError: Cannot read property 'get' of null
at Test.registerSuite.test <tests/test.js:11:17>
at Test.run <__intern/lib/Test.js:154:19>
at <__intern/lib/Suite.js:212:13>
at signalListener <__intern/node_modules/dojo/Deferred.js:37:21>
at Promise.then.promise.then <__intern/node_modules/dojo/Deferred.js:258:5>
at <__intern/lib/Suite.js:211:46>
I assumed that the WebDriver is not loaded, how may I access the remote browser environment inside my functional test?
Only functional tests interact with a WebDriver client and have a remote property. In your config, include your test suite in the functionalSuites array, not suites.
Note that the webdriver property is no longer used, so if you want to specify your username and access key in the config file you should use tunnelOptions instead.
tunnelOptions: {
username: <username>,
accessKey: <accessKey>
}
The tunnel knows the proper hostname to use by default, so you don't need to provide that.