Protractor capabilities.proxy equivalent in puppeteer - puppeteer

I am trying to use puppeteer instead of protractor.
In protractor config, I can use this config for proxy:
capabilities: {
browserName: 'chrome',
chromeOptions: {
binary: chromeBin,
args: [
'--window-size=1920,1080',
'--proxy-server=http://my-proxy/',
'--proxy-bypass-list=http://localhost'
]
},
proxy: {
proxyType: 'manual',
httpProxy: 'http://my-proxy'
}
}
It seems like what's inside chromeOptions matches the settings in puppeteer.launch:
browser = await puppeteer.launch({
executablePath: chromeBin,
headless,
args: [
'--window-size=1920,1080',
'--proxy-server=http://my-proxy',
'--proxy-bypass-list=http://localhost'
]
});
But where do I put the proxy in capabilities? I am not able to launch the page because of proxy issues.

Related

Unable to replicate data in ipfs-core

I am unable to replicate Orbit-DB data across different peers. I am using IPFS-CORE and have my application open in two different browsers but the data that is created in one browser is not showing up in another browser.
IPFS Config:
export default {
ipfs: {
start: true,
relay: {
enabled: true, // enable circuit relay dialer and listener
hop: {
active: true,
enabled: true, // enable circuit relay HOP (make this node a relay)
},
},
EXPERIMENTAL: {
pubsub: true,
},
preload: {
enabled: false,
},
config: {
Addresses: {
Swarm: [
'/dns4/wrtc-star1.par.dwebops.pub/tcp/443/wss/p2p-webrtc-star/',
'/dns4/wrtc-star2.sjc.dwebops.pub/tcp/443/wss/p2p-webrtc-star/',
'/dns4/webrtc-star.discovery.libp2p.io/tcp/443/wss/p2p-webrtc-star/',
],
},
},
},
}
IPFS Init:
import * as IPFS from 'ipfs-core'
import Config from '../config'
export const initIPFS = async () => {
let ipfs = await IPFS.create(Config.ipfs)
console.log(await ipfs.swarm.peers())
return ipfs
}
I am using “ipfs-core”: “^0.14.1”
When I print the peers in my swarm I’m getting an empty list which shouldn’t be the case. Any assistance would be greatly appreciated in solving this!

Trying to ''npm start" my vue.js build, but i get this error: This relative module was not found:

I'm trying to use node.js as my server and vue.js as my client side.
I'm building a chat application with both, with integrated stuff like Axios, Express, Sequelize and vuetify.
The project has been silent for a week of 2 due to a few complications.
I tried to start it back up again and i got this error on my server side:
ERROR Failed to compile with 1 errors 4:25:16 PM
This relative module was not found:
./src/main.js in multi (webpack)-dev-server/client?http://localhost:8081 webpack/hot/dev-server ./src/main.js
I've tried to change paths, restart servers and recreate files.
I'm quite new to Vue, so i have no clue what to do and i couldn't find an appropriate answer anywhere.
Here is the webpack.base.conf file
const path = require('path')
const utils = require('./utils')
const config = require('../config')
const vueLoaderConfig = require('./vue-loader.conf')
function resolve (dir) {
return path.join(__dirname, '..', dir)
}
const createLintingRule = () => ({
test: /\.(js|vue)$/,
loader: 'eslint-loader',
enforce: 'pre',
include: [resolve('src'), resolve('test')],
options: {
formatter: require('eslint-friendly-formatter'),
emitWarning: !config.dev.showEslintErrorsInOverlay
}
})
module.exports = {
context: path.resolve(__dirname, '../'),
entry: {
app: './src/main.js'
},
output: {
path: config.build.assetsRoot,
filename: '[name].js',
publicPath: process.env.NODE_ENV === 'production'
? config.build.assetsPublicPath
: config.dev.assetsPublicPath
},
resolve: {
extensions: ['.js', '.vue', '.json'],
alias: {
'vue$': 'vue/dist/vue.esm.js',
'#': resolve('src'),
}
},
module: {
rules: [
...(config.dev.useEslint ? [createLintingRule()] : []),
{
test: /\.vue$/,
loader: 'vue-loader',
options: vueLoaderConfig
},
{
test: /\.js$/,
loader: 'babel-loader',
include: [resolve('src'), resolve('test'), resolve('node_modules/webpack-dev-server/client')]
},
{
test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
loader: 'url-loader',
options: {
limit: 10000,
name: utils.assetsPath('img/[name].[hash:7].[ext]')
}
},
{
test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/,
loader: 'url-loader',
options: {
limit: 10000,
name: utils.assetsPath('media/[name].[hash:7].[ext]')
}
},
{
test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
loader: 'url-loader',
options: {
limit: 10000,
name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
}
}
]
},
node: {
// prevent webpack from injecting useless setImmediate polyfill because Vue
// source contains it (although only uses it if it's native).
setImmediate: false,
// prevent webpack from injecting mocks to Node native modules
// that does not make sense for the client
dgram: 'empty',
fs: 'empty',
net: 'empty',
tls: 'empty',
child_process: 'empty'
}
}```
It should just start the build like a regular app, but sadly.

Browserstack multiple browser does not run for protractor

I am trying to run multiple browsers in parallel using browser stack but it does not seem possible with it. This is is my config file
exports.config = {
capabilities: {
'browserstack.user' : 'abc2',
'browserstack.key' : 'asdasdasdasdj',
// Needed for testing localhost
'browserstack.local' : 'false',
multiCapabilities: [
{
browserName: 'Safari',
browser_version: '8.0',
os: 'OS X',
os_version: 'Yosemite'
},
{
browserName: 'Firefox',
browser_version: '30.0',
os: 'Windows',
os_version: '7'
},
{
browserName: 'iPhone',
platform: 'MAC',
device: 'iPhone 5S'
}
]
},
When i run - npm run protractor, i get this error Target browser must be a string, but is ; did you forget to call forBrowser()?
You need to specify browserName capability under capabilities block. Below is a working sample
exports.config = {
'specs': [ '../specs/single.js' ],
'seleniumAddress': 'http://hub-cloud.browserstack.com/wd/hub',
'commonCapabilities': {
'browserstack.user': process.env.BROWSERSTACK_USERNAME || 'BROWSERSTACK_USERNAME',
'browserstack.key': process.env.BROWSERSTACK_ACCESS_KEY || 'BROWSERSTACK_ACCESS_KEY',
'build': 'protractor-browserstack',
'name': 'parallel_test',
'browserstack.debug': 'true',
'browserName': 'Chrome'
},
'multiCapabilities': [{
'browserName': 'Chrome'
},{
'browserName': 'Safari'
},{
'browserName': 'Firefox'
},{
'browserName': 'IE'
}]
};
// Code to support common capabilities
exports.config.multiCapabilities.forEach(function(caps){
for(var i in exports.config.commonCapabilities) caps[i] = caps[i] || exports.config.commonCapabilities[i];
});
The 'browserName': 'Chrome' capability will later be overriden by your multiCapabilities block.

how to make auto reload work when HMR enabled

I've been trying multiple times to configure webpack. Everytime I start the process, auto reload works fine all the way, until I enable --hot for web-dev-server, then any change to the html has no impact, no errors, nothing, just a log in terminal that there's been a change, and a log on browser console that there's nothing to update. Hot reload works fine for CSS and JS, and I understand HTML doesn't support HMR but at least expected auto refresh to keep working ...
My configuration below:
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const HtmlWebpackHarddiskPlugin = require('html-webpack-harddisk-plugin');
const webpack = require('webpack');
module.exports = {
entry: './src/js/index.js',
output: {
filename: 'app.js',
path: path.resolve(__dirname, 'dist'),
},
plugins: [
new HtmlWebpackPlugin({
title: 'Hello world',
template: 'src/views/index.html',
alwaysWriteToDisk: true
}),
new HtmlWebpackHarddiskPlugin(),
new webpack.NamedModulesPlugin(),
new webpack.HotModuleReplacementPlugin()
],
devtool: 'inline-source-map',
devServer: {
contentBase: path.join(__dirname, 'dist'),
compress: true,
hot: true,
inline: true,
open: true,
},
module: {
rules: [
{
test: /\.css$/,
use: [
'style-loader',
'css-loader',
]
},
{
test: /\.(png|svg|jpg|gif)$/,
use: [
'file-loader',
]
}
]
}
};
My scripts in package.json
"scripts": {
"dev": "webpack-dev-server --config webpack.config.js",
"prod": "cross-env NODE_ENV=production webpack -p --config webpack.config.js"
},
I am not sure if this is the "right" way to achieve it. But this is working for me with the following amends.
devServer: {
**contentBase: resolve('src/views'),**
open: true,
hot: true,
stats: "errors-only",
overlay: true,
**watchContentBase: true**
},
This does not seem to make sense to me but, if you set watchContentBase to true and point the contentBase to "dist", you lose HMR and any changes (event to css/js files) will cause a full reload which is not what I was aiming for.
my src structure below:
/ src
- images
- js
- sass
- views
I had also a look at vue-cli which seems to suffer from the same issue. Any changes to the index.html are not reflected (does not trigger a full page reload).

Configure wallaby for React-redux-es6-typescript-immutable applications

How to configure wallaby for React-redux-es6-typescript-immutable application. I use webstorm editor. My base code is committed here
I tried the following code in wallaby.js, but it throws
ReferenceError: Can't find variable: exports
at src/store.ts:3
module.exports = function (wallaby) {
return {
files: [
'src/*.ts'
],
tests: [
'test/*Spec.ts'
],
compilers: {
'**/*.ts': wallaby.compilers.typeScript({
module: 5, // ES6
target: 2 // ES6
})
},
preprocessors: {
'**/*.js': file => require('babel-core').transform(
file.content,
{sourceMap: true, presets: ['es2015']})
}
}
}
I have more or less the same setup as you. Did you try setting the env variable to node?
My working wallaby.js config file for babel 6 is the following:
module.exports = function() {
return {
files: [
{pattern: "src/**/*.js*"}
],
tests: [
{pattern: "tests/integration/*.js"}
],
env: {
type: "node"
},
preprocessors: {
"**/*.js": file => require("babel-core").transform(file.content, {sourceMap: true, presets: ["es2015"]})
}
};
};