Develop Reference

how to make .eslintrc accept single quotes

I am facing this error when I 'npm start' my project:
I already know the problem is in the .eslintrc file so I added this:
"rules": {
"quotes": [2, "single"],
}
and it's not working and it's the only solution I know
Update:
I tried deleting eslintConfig from package.json and it didn't work
and also "quotes": ["error", "single"] didn't work

You can try to turn the rule off by passing 0 in the .eslintrc config file:
{
"rules": {
"quotes": [0, "single"]
}
}

Based on the heading the solution is just to add a rule to allow single quotes. Refer below config, checkout rules object:
module.exports = {
env: {
browser: true,
es2020: true,
},
extends: ["eslint:recommended", "plugin:#typescript-eslint/recommended"],
parser: "#typescript-eslint/parser",
parserOptions: {
ecmaVersion: 11,
sourceType: "module",
},
plugins: ["#typescript-eslint", "prettier"],
rules: {
"prettier/prettier": [
1,
{
trailingComma: "es5",
//to enable single quotes
singleQuote: true,
semi: true,
},
],
...require("eslint-config-prettier").rules,
...require("eslint-config-prettier/#typescript-eslint").rules,
},
};
Try this out. If it doesn't work then share a bit more about the problem. May be write a small code try to replicate the issue and then share it here.
I hope this will help you out.
Cheers :)

Run eslint with the —fix flag and the problem will go away

I think you want to disable "quote" and "prettier/prettier" rules.
Please you can pass 0 to disable a rule.
{
"rules": {
"quotes": 0,
"prettier/prettier": 0
}
}

How to get React .js file to format correctly

I have a file named App.js in Visual Studio Code and the file actually renders fine in the browser, but it does not format correctly:
I have switched the file type to javascriptreact:
But it still won't format with SHIFT-ALT-F.
Here is my settings.json file:
{
"terminal.integrated.shell.windows": "C:\\Program Files\\Git\\bin\\bash.exe",
"explorer.confirmDelete": false,
"files.autoSave": "afterDelay",
"editor.formatOnSave": true,
"explorer.confirmDragAndDrop": false,
"editor.acceptSuggestionOnEnter": "off",
"editor.fontSize": 12,
"window.zoomLevel": 0,
"workbench.editor.enablePreview": false,
"editor.renderWhitespace": "all",
"[javascriptreact]": {
"editor.defaultFormatter": "HookyQR.beautify"
},
"[javascript]": {
"editor.defaultFormatter": "HookyQR.beautify"
},
"[html]": {
"editor.defaultFormatter": "HookyQR.beautify"
},
"[json]": {
"editor.defaultFormatter": "HookyQR.beautify"
},
"editor.wordWrap": "on",
"git.enableSmartCommit": true,
"git.autofetch": true,
"diffEditor.ignoreTrimWhitespace": false,
"workbench.sideBar.location": "left",
}
What else do I need to set so that SHIFT-ALT-F properly formats my React Javascript file?

How to setup Atom JS autocomplete?

I'm trying to get autocomplete suggestions from my Atom code editor. When I'm trying doc I expecting document and when I typing document.que I'm expecting Atom would show me .querySelector(). And it's doesn't happening. I've installed these packages to resolve the issue:
atom-ternjs
After that I still doesn't get autocomplete for doc or document. My -tern.project file looks like this:
{
"ecmaVersion": 6,
"libs": [],
"loadEagerly": [],
"dontLoad": [
"node_modules/**"
],
"plugins": {
"doc_comment": true,
"complete_strings": {
"maxLength": 15
},
"node": {
"dontLoad": "",
"load": "",
"modules": ""
},
"modules": {
"dontLoad": "",
"load": "",
"modules": ""
},
"es_modules": {}
}
}
So, how do you autocomplete JS in Atom? Interesting thing - notice if I create array and try array. then Atom gives me suggestions like .pop .push and others but why it doesn't give me a document. => .querySelector() and other for DOM manipulation.
My Atom config.cson:
"*":
core:
telemetryConsent: "no"
editor:
fontSize: 13
"exception-reporting":
userId: "bla-bla-bla"
"linter-ui-default":
showPanel: true

I found the answer. Need to activate:
Packages => Atom Ternjs => Configure Project => and here need to checkmark for Browser option.

Setting up Sencha extjs project

I am attempting to set up a Sencha extjs 6 project. I would like to be able to have both the modern and classic packages available. I'm following this set-up tutorial, but am not finding it very helpful.
If my understanding is correct, I should be able to have one app that accessible as both a desktop and mobile site. This is great and works for the uncompiled path (my app is in the folder root/sencha) mysite.com/sencha. However, if access the root site it also gives me the uncompiled path instead of using the build app.js.
My index page is at root/layouts/index.html. My extjs app is in root/sencha.
The relevant parts of my app.json are:
...
"indexHtmlPath": "../layouts/index.html",
"production": {
"output": {
"page": {
"path": "../../../../layouts/index.html",
"enable": false
},
"appCache": {
"enable": true,
"path": "cache.appcache"
},
"microloader": {
"path": "microloader.js",
"embed": false,
"enable": true
}
},
"loader": {
"cache": "${build.timestamp}"
},
"cache": {
"enable": true
},
"compressor": {
"type": "yui"
}
},
"output": {
"base": "${workspace.build.dir}/${build.environment}/${app.name}",
"page": "index.html",
"manifest": "${build.id}.json",
"js": "${build.id}/app.js",
"appCache": {
"enable": false
},
"resources": {
"path": "${build.id}/resources",
"shared": "resources"
}
},
...

As pagep suggested you just deploy on your production server the content of the build/production directory and not the source code. That way you only deploy the minimized and compressed files (classic/app.js, classic/resources/YourApp.css, modern/app.js, modern/resources/YourApp.css, etc...).

How can I run multiple tests in parallel with JS/nightwatchjs?

Can I execute multiple test cases in parallel through Nightwatch ?Is it Possible?
I am searching for ability of threading capability in java for parallel test case execution.
Also what do you guys think about moving from Selenium to Nightwatch?

You can see the thread for parallelism: nightwatchjs also take a look into parallel run
Nightwatch is using the same selenium webdriver protocol but with some extra additions.

Yes you can leverage the parallel mode of nightwatch js using following configuration:
test_workers: {
enabled: true,
workers: 'auto'
}

To execute tests in multiple browsers, you need to add the desired capabilities of the browsers and Test_worker configurations in nightwatch.json file.
For eg. if you want to use Opera you have to add this config:
"cli_args": {
//path to Opera Webdriver File
"webdriver.opera.driver": "bin/operadriver"
}
"opera": {
"desiredCapabilities": {
"browserName": "opera"
}
}
For Test_Worker Configuration you should add:
"test_workers": {
"enabled": true,
"workers": "auto"
}
For example if you want to execute tests in three browsers parallely - Chrome, Firefox and Opera, your nightwatch.json should something like this.
{
"src_folders": [
"tests"
],
"output_folder": "reports",
"selenium": {
"start_process": true,
"server_path": "bin/selenium-server-standalone-3.12.0.jar",
"log_path": "",
"port": 4444,
"cli_args": {
"webdriver.chrome.driver": "bin/chromedriver",
"webdriver.gecko.driver": "bin/geckodriver",
"webdriver.opera.driver": "bin/operadriver"
}
},
"test_workers": {
"enabled": true,
"workers": "auto"
},
"test_settings": {
"default": {
"launch_url": "http://localhost",
"selenium_port": 4444,
"selenium_host": "localhost",
"silent": true,
"screenshots": {
"enabled": false,
"path": ""
},
"desiredCapabilities": {
"browserName": "chrome"
}
},
"firefox": {
"desiredCapabilities": {
"browserName": "firefox",
"marionette": true
}
},
"opera": {
"desiredCapabilities": {
"browserName": "opera"
}
}
}
}
For more info, you can look into this article: How To Execute Tests In Multiple Browsers Parallely With NIGHTWATCH JS.