Error while running "waitForElementVisible" command for Microsoft Edge on nightwatchj.s - microsoft-edge

When I trying run test in Microsoft edge
browser starting and page is loading, but then I got error :
TypeError: Error while running "waitForElementVisible" command: Error while trying to create HTTP request for "/wd/hub/session/8bf67432a94d18e24f88493fd249c629/element/[object Object]/displayed": Request path contains unescaped characters
For Chrome and Firefox test works fine
Test code
module.exports = {
'Demo test Ecosia.org': function (browser) {
browser
.url('https://www.ecosia.org/')
.waitForElementVisible('body')
.assert.titleContains('Ecosia')
.assert.visible('input[type=search]')
.setValue('input[type=search]', 'nightwatch')
.assert.visible('button[type=submit]')
.click('button[type=submit]')
.assert.containsText('.mainline-results', 'Nightwatch.js')
.end();
}
};
My nightwatch.conf.js
const seleniumServer = require('selenium-server');
const edgeDriver = require('edgedriver');
const chromeDriver = require('chromedriver');
const geckoDriver = require('geckodriver');
module.exports = {
src_folders: ['tests'],
custom_commands_path: '',
custom_assertions_path: '',
page_objects_path: '',
globals_path: '',
live_output: false,
disable_colors: false,
parallel_process_delay: 10,
"test_workers": {
"enabled": false,
"workers": "auto"
},
selenium: {
start_process: true,
//start_session: false,
server_path: seleniumServer.path,
check_process_delay: 5000,
host: '127.0.0.1',
port: 4144,
cli_args: {
"webdriver.ie.driver": ieDriver.path,
"webdriver.chrome.driver": chromeDriver.path,
"webdriver.gecko.driver": geckoDriver.path,
"webdriver.edge.driver": "node_modules/edgedriver_win64/msedgedriver.exe"
}
},
test_settings: {
skip_testcases_on_fail: false,
end_session_on_fail: false,
default: {
desiredCapabilities: {
browserName: 'chrome',
}
},
chrome: {
desiredCapabilities: {
browserName: 'chrome',
javascriptEnabled: true,
acceptSslCerts: true,
chromeOptions: {
w3c: false,
args: ['disable-gpu']
}
}
},
firefox: {
desiredCapabilities: {
browserName: 'firefox',
javascriptEnabled: true,
acceptSslCerts: true,
marionette: true,
}
},
edge: {
desiredCapabilities: {
browserName: 'MicrosoftEdge',
javascriptEnabled: true,
acceptSslCerts: true
}
},
}
};

As you're using the new Edge which is based on chromium, I think you can refer to the same setting of Chrome.
The same error occurs when using Chrome can be fixed by adding "w3c": false. So you could add the following line to fix issue in Edge Chromium:
edgeOptions: { "w3c": false }
Reference link: TypeError ERR_UNESCAPED_CHARACTERS on testing Vue project using Nightwatch

Related

How add rollupNodePolyFill to electron.vite.configs

I need excute 'twilio-client' on electron project
import Twilio from 'twilio-client';
// this line broken when run electron-vite preview or builded app version
const device = new Twilio.Device();
device.setup('xyls', {
debug: true
});
console.log(device);
When I run my app with electron-vite preview or after build, I got an error:
Uncaught TypeError: Failed to resolve module specifier "events"
This also happened when it was executed:
electron-vite dev --watch
I added nodePolifill plugins now it works in dev mode, but on preview or build doesn't
The plugin 'rollup-plugin-node-polyfills' doesn't works on build.rollupOptions.plugins
I need help
My electron.vite.configs.ts:
import { resolve, normalize, dirname } from 'path'
import { defineConfig } from 'electron-vite'
import injectProcessEnvPlugin from 'rollup-plugin-inject-process-env'
import tsconfigPathsPlugin from 'vite-tsconfig-paths'
import reactPlugin from '#vitejs/plugin-react'
import { NodeGlobalsPolyfillPlugin } from '#esbuild-plugins/node-globals-polyfill'
import { NodeModulesPolyfillPlugin } from '#esbuild-plugins/node-modules-polyfill'
import rollupNodePolyFill from "rollup-plugin-node-polyfills";
import { main, resources } from './package.json'
const [nodeModules, devFolder] = normalize(dirname(main)).split(/\/|\\/g)
const devPath = [nodeModules, devFolder].join('/')
const tsconfigPaths = tsconfigPathsPlugin({
projects: [resolve('tsconfig.json')],
})
export default defineConfig({
main: {
plugins: [tsconfigPaths],
build: {
rollupOptions: {
input: {
index: resolve('src/main/index.ts'),
},
output: {
dir: resolve(devPath, 'main'),
},
},
},
},
preload: {
plugins: [tsconfigPaths],
build: {
outDir: resolve(devPath, 'preload'),
},
},
renderer: {
define: {
'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV),
'process.platform': JSON.stringify(process.platform),
},
server: {
port: 4927,
},
publicDir: resolve(resources, 'public'),
plugins: [
tsconfigPaths,
reactPlugin(),
],
resolve: {
alias: {
util: 'rollup-plugin-node-polyfills/polyfills/util',
sys: 'util',
stream: 'rollup-plugin-node-polyfills/polyfills/stream',
path: 'rollup-plugin-node-polyfills/polyfills/path',
querystring: 'rollup-plugin-node-polyfills/polyfills/qs',
punycode: 'rollup-plugin-node-polyfills/polyfills/punycode',
url: 'rollup-plugin-node-polyfills/polyfills/url',
string_decoder: 'rollup-plugin-node-polyfills/polyfills/string-decoder',
http: 'rollup-plugin-node-polyfills/polyfills/http',
https: 'rollup-plugin-node-polyfills/polyfills/http',
os: 'rollup-plugin-node-polyfills/polyfills/os',
assert: 'rollup-plugin-node-polyfills/polyfills/assert',
constants: 'rollup-plugin-node-polyfills/polyfills/constants',
_stream_duplex: 'rollup-plugin-node-polyfills/polyfills/readable-stream/duplex',
_stream_passthrough: 'rollup-plugin-node-polyfills/polyfills/readable-stream/passthrough',
_stream_readable: 'rollup-plugin-node-polyfills/polyfills/readable-stream/readable',
_stream_writable: 'rollup-plugin-node-polyfills/polyfills/readable-stream/writable',
_stream_transform: 'rollup-plugin-node-polyfills/polyfills/readable-stream/transform',
timers: 'rollup-plugin-node-polyfills/polyfills/timers',
console: 'rollup-plugin-node-polyfills/polyfills/console',
vm: 'rollup-plugin-node-polyfills/polyfills/vm',
zlib: 'rollup-plugin-node-polyfills/polyfills/zlib',
tty: 'rollup-plugin-node-polyfills/polyfills/tty',
domain: 'rollup-plugin-node-polyfills/polyfills/domain',
events: 'rollup-plugin-node-polyfills/polyfills/events',
buffer: 'rollup-plugin-node-polyfills/polyfills/buffer-es6', // add buffer
process: 'rollup-plugin-node-polyfills/polyfills/process-es6', // add process
}
},
optimizeDeps: {
esbuildOptions: {
// Node.js global to browser globalThis
define: {
global: 'globalThis'
},
// Enable esbuild polyfill plugins
plugins: [
NodeGlobalsPolyfillPlugin({
process: true,
buffer: true,
}),
NodeModulesPolyfillPlugin(),
]
}
},
worker: {
format: "es",
},
build: {
outDir: resolve(devPath, 'renderer'),
rollupOptions: {
plugins: [
injectProcessEnvPlugin({
NODE_ENV: 'production',
platform: process.platform,
}),
rollupNodePolyFill() //this line doesn't works
],
input: {
index: resolve('src/renderer/index.html'),
},
output: {
format: "esm",
dir: resolve(devPath, 'renderer'),
},
},
},
},
})
and the is my project repostitory:
https://github.com/caioregatieri/app-electron
I tried add many polyfills, add twilio import on preload and export to render with
contextBridge.exposeInMainWorld('Twilio', Twilio)
I solved it with:
electron.vite.config.ts
build: {
outDir: resolve(devPath, 'renderer'),
rollupOptions: {
plugins: [
injectProcessEnvPlugin({
NODE_ENV: 'production',
platform: process.platform,
}),
rollupNodePolyFill,
],
},
},
and this:
index.html
<script>
global = globalThis;
</script>

cypress 12 docker throw error socket_posix.cc(93)] CreatePlatformSocket() failed: Address family not supported by protocol (97)

I upgraded my cypress version from cypress 8 to cypress 12.
I am executing all my test cases on jenkins server OS centos 7 using base image cypress/base:16.13.0.
When I executed all the test cases on my local window 10 using same docker image cypress/base:16.13.0 and "cypress": "^12.3.0",All works perfectly good.
BUT when I trying to run the same project on Jenkins server centos 7 OS, throw an error
[476:0123/104731.525262:ERROR:socket_posix.cc(93)] CreatePlatformSocket() failed: Address family not supported by protocol (97)
Note : When I executed the same package (test cases) on cypress 8 all works good.
Kindly suggest me how to fix this?
cypress.config.js file :
const { defineConfig } = require('cypress');
const createBundler = require('#bahmutov/cypress-esbuild-preprocessor');
const addCucumberPreprocessorPlugin =
require('#badeball/cypress-cucumber-preprocessor').addCucumberPreprocessorPlugin;
const createEsbuildPlugin =
require('#badeball/cypress-cucumber-preprocessor/esbuild').createEsbuildPlugin;
module.exports = defineConfig({
defaultCommandTimeout: 5000,
numTestsKeptInMemory: 0,
viewportWidth: 1360,
viewportHeight: 768,
env: {
username: 'xxxx',
password: '',
},
"retries": 1,
"video": false,
e2e: {
// Integrate #bahmutov/cypress-esbuild-preprocessor plugin.
async setupNodeEvents(on, config) {
const bundler = createBundler({
plugins: [createEsbuildPlugin(config)],
});
// This is required for the preprocessor to be able to generate JSON reports after each run, and more,
on('file:preprocessor', bundler);
await addCucumberPreprocessorPlugin(on, config);
return config;
},
specPattern: 'cypress/e2e/**/*.feature',
},
});
Package.json
"#badeball/cypress-cucumber-preprocessor": "^15.1.0",
"#deepakvishwakarma/cucumber-json-formatter": "^0.0.3",
"cypress": "^12.3.0",
"moment": "^2.29.4",
"multiple-cucumber-html-reporter": "^3.1.0"
},
"dependencies": {
"#bahmutov/cypress-esbuild-preprocessor": "^2.1.5",
"cypress-xpath": "^2.0.1"
},
"cypress-cucumber-preprocessor": {
"stepDefinitions": "cypress/e2e/**/*.cy.js",
"commonPath": "cypress/e2e/common/**/*.cy.js",
"filterSpecs": true,
"omitFiltered": true,
"nonGlobalStepDefinitions": true,
"json": {
"enabled": true,
"output": "cypress/cucumber_report/log.json",
"formatter": "node",
"args": [
"./node_modules/#deepakvishwakarma/cucumber-json-formatter/lib/main.js"
]
},
"cucumberJson": {
"generate": true,
"outputFolder": "cypress/cucumber_report",
"filePrefix": "",
"fileSuffix": ".cucumber"
}
}
}

Appium - Codeceptjs - Gherkin, can not execute steps script and config failed

I've got some issues with codeceptjs appium.
I run test script by npx codeceptjs run , it did not execute the step_definitions file.
I config steps definition with /*steps.js and its not working, i have to direct exact path of steps file.
The app crashed without throw exception, the script still being execute.
add-task.feature
Feature: Add task
Background: I opened the application
Scenario: Add task
Given I click Add Task button
And I input all information
add-task-steps.js
When("I input all information", () => {
AddTaskScreen.inputTaskName('sdsada')
});
const HomeScreen = require("../screens/home-screen.js")
const { I } = inject();
home-screen-steps.js
Given("I click Add Task button", () => {
HomeScreen.tapAddTaskButton();
});
Details
CodeceptJS version: ^3.3.6
NodeJS Version: 8.15.0
Operating System: Windows 10
webdriverio 7.25.2
Configuration file:
exports.config = {
output: './output',
helpers: {
Appium: {
app: 'Appium/ToDoList.apk',
platform: 'Android',
device: 'emulator-5556'
}
},
include: {
I: './steps_file.js',
env:{
TIMEOUT: 5000,
}
},
mocha: {},
bootstrap: null,
timeout: null,
teardown: null,
hooks: [],
gherkin: {
features: './features/*.feature',
steps: ['./step_definitions/home-screen-steps.js']
},
plugins: {
screenshotOnFail: {
enabled: true
},
tryTo: {
enabled: true
},
retryFailedStep: {
enabled: false
},
retryTo: {
enabled: true
},
eachElement: {
enabled: true
},
pauseOnFail: {}
},
stepTimeout: 10000,
stepTimeoutOverride: [{
pattern: 'wait.*',
timeout: 0
},
{
pattern: 'amOnPage',
timeout: 0
}
],
tests: './*_test.js',
name: 'appium'
}
Thanks in advance. <3
I resolved it by replace waitForElementToBeClickable with waitForElement.
Idk why Codeceptjs not recognize waitForElementToBeClickabe and also not throw any exception.

Vue CLI HMR not working after upgrading to v5

I'm developing a Django+Vue app using VSCode devcontainers (Docker).
I have recently migrated from Vue CLI v4 to Vue CLI v5 following the migration guide.
After the migration, the HMR of the dev-server stopped working.
This was my vue.config.js before the migration:
const BundleTracker = require("webpack-bundle-tracker");
module.exports = {
publicPath: process.env.NODE_ENV === "development" ? "http://localhost:8080/" : "/static/",
devServer: {
host: "0.0.0.0",
port: 8080,
public: "0.0.0.0:8080",
https: false,
headers: { "Access-Control-Allow-Origin": ["*"] },
hotOnly: true,
watchOptions: {
ignored: "./node_modules/",
aggregateTimeout: 300,
poll: 1000,
},
},
transpileDependencies: ["vuetify"],
css: {
sourceMap: true,
},
chainWebpack: (config) => {
config.plugin("BundleTracker").use(BundleTracker, [
{
filename: `./config/webpack-stats-${process.env.NODE_ENV}.json`,
},
]);
config.resolve.alias.set("__STATIC__", "static");
},
};
And after:
const { defineConfig } = require("#vue/cli-service");
const BundleTracker = require("webpack-bundle-tracker");
module.exports = defineConfig({
publicPath: process.env.NODE_ENV === "development" ? "http://localhost:8080/" : "/static/",
devServer: {
host: "0.0.0.0",
port: 8080,
client: {
webSocketURL: "auto://0.0.0.0:8080/ws",
},
https: false,
headers: { "Access-Control-Allow-Origin": ["*"] },
hot: "only",
static: {
watch: {
ignored: "./node_modules/",
aggregateTimeout: 300,
poll: 1000,
},
},
},
transpileDependencies: ["vuetify"],
css: {
sourceMap: true,
},
chainWebpack: (config) => {
config.plugin("BundleTracker").use(BundleTracker, [
{
filename: `./config/webpack-stats-${process.env.NODE_ENV}.json`,
},
]);
config.resolve.alias.set("__STATIC__", "static");
},
});
After the migration, a new warning shows everytime I run npm run serve (but devServer.public has been removed in v5!):
App running at:
- Local: http://localhost:8080/
It seems you are running Vue CLI inside a container.
Since you are using a non-root publicPath, the hot-reload socket
will not be able to infer the correct URL to connect. You should
explicitly specify the URL via devServer.public.
Access the dev server via http://localhost:<your container's external mapped port>http://localhost:8080/
Note that the development build is not optimized.
To create a production build, run npm run build.
Any ideas?
Thanks in advance!
My team had similar issues as you are describing. We could fix it by adding the optimization object to our Webpack config (vue.config.js`).
const {defineConfig} = require('#vue/cli-service');
module.exports = defineConfig({
/* your config */
configureWebpack: {
optimization: {
runtimeChunk: 'single',
},
},
devServer: {
// we need this for apollo to work properly
proxy: `https://${process.env.SANDBOX_HOSTNAME}/`,
host: '0.0.0.0',
allowedHosts: 'all',
},
});
The optimization part fixed the HMR for us. However, if you're using Firefox, your console might still be spammed by error messages like these:
The connection to wss://SANDBOX_HOSTNAME:8080/ws was interrupted while
the page was loading.
This has been a blocker of vue 3 for us, so I hope it helps. ✌️

Nuxt ssr asyncData axios request not works on page reload

After 5-6 hours of searching for the solution, I start to give up. I have a project with docker, node & nuxt.I would like to share meta tags on FB and for this, I need SSR && vue-meta and for vue-meta I need asyncData.
it works with different api!
async asyncData({ params, $axios, error }) {
const product = await $axios.$get(`https://api.nuxtjs.dev/posts/1`);
return { product };
},
It is working when i navigate to here with nuxt routing, but if i reload the page (just here) then i get a RuntimeError from the nuxt ssr.
SO THE REAL PROBLEM IS I GET A RuntimeError ON PAGE RELOAD ON LOCALHOST
async asyncData({ params, $axios, error }) {
//axios knows the api
//http://localhost:8080/
const product = await $axios.$get(`products/${params.id}`);
return { product };
},
If I try this with Axios then I get this error:
Cannot read property 'data' of undefined
If I try this with #nuxt/http then I get this error
request to http://localhost:8080/products/some-id failed, reason: connect ECONNREFUSED 127.0.0.1:8080
I think the problem is when I push hard reload on this page, then I cannot make requests on localhost but I don't know why and how to solve it.
my nuxt-config.js
export default {
// Disable server-side rendering (https://go.nuxtjs.dev/ssr-mode)
// ssr: false,
// Global page headers (https://go.nuxtjs.dev/config-head)
head: {
title: '',
meta: [
{ charset: 'utf-8' },
{ name: 'viewport', content: 'width=device-width, initial-scale=1' },
{ hid: 'description', name: 'description', content: '' }
],
link: [
{ rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' },
{ rel: 'preconnect', href: 'https://fonts.gstatic.com' },
{ rel: 'stylesheet', href: 'https://fonts.googleapis.com/css2?family=Josefin+Sans:wght#300;400;600&display=swap' },
]
},
// Global CSS (https://go.nuxtjs.dev/config-css)
css: [
'#/assets/scss/styles.scss',
// '~node_modules/bootstrap/dist/css/bootstrap.css',
// '~node_modules/bootstrap-vue/dist/bootstrap-vue.css',
],
// Plugins to run before rendering page (https://go.nuxtjs.dev/config-plugins)
plugins: [
'~/plugins/notifier',
'~/plugins/axios',
'~/plugins/dateFilter',
'~/plugins/loading',
],
// Auto import components (https://go.nuxtjs.dev/config-components)
components: true,
// Modules for dev and build (recommended) (https://go.nuxtjs.dev/config-modules)
buildModules: [
'nuxt-lazysizes', //https://github.com/ivodolenc/nuxt-lazysizes
'#aceforth/nuxt-optimized-images', //https://github.com/juliomrqz/nuxt-optimized-images //only build
],
// Modules (https://go.nuxtjs.dev/config-modules)
modules: [
'#nuxtjs/axios',
'#nuxtjs/auth',
'#nuxtjs/style-resources',
'nuxt-i18n',
'bootstrap-vue/nuxt',
'#nuxt/http',
],
styleResources: {
scss: [
// './assets/scss/*.scss',
'#/assets/scss/_variables.scss',
'#/node_modules/bootstrap/scss/_functions.scss',
'#/node_modules/bootstrap/scss/_variables.scss',
'#/node_modules/bootstrap/scss/mixins/_breakpoints.scss',
]
},
bootstrapVue: {
bootstrapCSS: false,
bootstrapVueCSS: false,
icons: false,
},
axios: {
// baseURL: ``, //built by docker compose from API_PORT && API_HOST variables
},
auth: {
strategies: {
local: {
endpoints: {
login: { url: '/auth/login', method: 'post', propertyName: 'token' },
logout: false,
user: { url: '/auth/user', method: 'get', propertyName: 'user' },
},
}
},
redirect: {
login: '/login',
logout: '/',
callback: '/login',
home: '/admin/products',
},
},
// Build Configuration (https://go.nuxtjs.dev/config-build)
build: {
// babel: {
// compact: true,
// },
},
router: {
extendRoutes(routes, resolve) {
routes.push(
{
name: 'product-edit',
path: '/admin/products/edit/:id',
component: 'pages/admin/products/add.vue',
},
{
name: 'product-image-upload',
path: '/admin/products/product-image-upload/:id',
component: 'pages/admin/products/product-image-upload.vue',
},
{
name: 'gallery-image-upload',
path: '/admin/gallery-image-upload',
component: 'pages/admin/gallery-image-upload.vue',
},
);
}
},
env: {
baseUrl: `${process.env.BASE_URL}`,
imagePath: `${process.env.BASE_URL}:${process.env.API_PORT}/uploads`,
},
publicRuntimeConfig: {
baseUrl: `${process.env.BASE_URL}`,
imagePath: `${process.env.BASE_URL}:${process.env.API_PORT}/uploads`,
},
loading: '~/components/LoadingBar.vue',
i18n: {
locales: [
{ code: 'en', iso: 'en-US', file: 'en.js' },
{ code: 'hu', iso: 'hu-HU', file: 'hu.js' },
{ code: 'de', iso: 'de-DE', file: 'de.js' },
],
defaultLocale: 'en',
lazy: true,
langDir: '/i18n/',
parsePages: false,
vueI18n: {
fallbackLocale: 'en',
},
detectBrowserLanguage: {
useCookie: true,
cookieKey: 'i18n_redirected',
},
seo: false,
vueI18nLoader: true,
strategy: 'no_prefix',
},
lazySizes: {
extendAssetUrls: {
img: 'data-src',
source: 'data-srcset',
// Component with custom props
AppImage: ['source-md-url', 'image-url'],
},
},
optimizedImages: {
inlineImageLimit: 1000,
handleImages: ['jpeg', 'png', 'svg', 'webp', 'gif'],
optimizeImages: false,
optimizeImagesInDev: false,
defaultImageLoader: 'img-loader',
mozjpeg: {
quality: 80,
},
optipng: {
optimizationLevel: 3,
},
pngquant: false,
gifsicle: {
interlaced: true,
optimizationLevel: 3,
},
svgo: {
// enable/disable svgo plugins here
},
webp: {
preset: 'default',
quality: 75,
},
},
};
my docker-compose.yml
version: '3'
services:
server:
build:
context: ./server
env_file: .env
expose:
- $SERVER_PORT
ports:
- $SERVER_PORT:$SERVER_PORT
volumes:
- ./server:/usr/app
- /usr/app/node_modules
client:
build:
context: ./client
env_file: .env
environment:
NUXT_HOST: 0.0.0.0
NUXT_PORT: $CLIENT_PORT
API_HOST: 0.0.0.0
API_PORT: $SERVER_PORT
BASE_URL: $BASE_URL
volumes:
- ./client:/usr/app
- /usr/app/node_modules
expose:
- $CLIENT_PORT
ports:
- $CLIENT_PORT:$CLIENT_PORT
Update: if I start my nuxt project without Docker then everything works fine but this is not a solution for me :D
I have solved my question. I had to use nginx proxy as a container and some nuxt config.
// https://axios.nuxtjs.org/options/
privateRuntimeConfig: {
axios: {
baseURL: 'http://nginx/api' // name of the docker proxy
}
},

Resources