"Cucumber Full Support" extension in VS code and I'm facing configuration issues - testing

Issue:
-Curly lines are displayed in the feature file even when step definitions are available and properly mentioned in the settings.json file
-Go to step definitions and Peek Step definitions options aren't displayed
Expected behavior:
User should be displayed Curly lines only for steps which doesn't have step definitions
User should be able to Go to step definitions from feature files using "Go to Step definition" option on right click
Settings.json file:
{
"cucumberautocomplete.steps": ["stepDefinitions/*.ts"],
"cucumberautocomplete.syncfeatures": "featureFiles/*feature",
"cucumberautocomplete.strictGherkinCompletion": true,
"cucumberautocomplete.strictGherkinValidation": true,
"cucumberautocomplete.smartSnippets": true,
"cucumberautocomplete.stepsInvariants": true,
"workbench.iconTheme": "vscode-icons",
"files.autoSave": "afterDelay",
"cucumberautocomplete.customParameters": [
]
}
My Project structure:
-PROJECT NAME
-featureFiles
-features1.feature
-features1.feature
-stepDefinitions
-stepDefintions_1.ts
-stepDefintions_2.ts
-stepDefintions_3.ts
-pageObjects
-logs
-configFiles
-commonUtlities
-node_modules
-reports
-package.json
-ts-config.json

So this works for me. My settings.json file lives in the .vscode folder, which sits in the folder that I open in vscode (see image). The cucumberautocomplete.steps value is relative to this same folder.

I had the same problem. And, like you, I tried many variations of path.
Finally, only these settings worked for me:
"cucumberautocomplete.steps": [
"**/*.rb"
],
"cucumberautocomplete.syncfeatures": "**/*.feature",
"cucumberautocomplete.strictGherkinCompletion": true,
"editor.quickSuggestions": {
"other": true,
"comments": false,
"strings": true
}

Related

What is the default CSS property order?

i have been trying to find documentation on this but i havent been able to. I use stylint in a project and we have the css order option activated. I haven't been able to set up VS code to show the errors and i haven't found a page with the information to actually know the order,so i always need to check on compile time if i have any mistakes in the CSS order properties, and it shows a huge error on screen.
this are the stylelint rules we have
module.exports = {
extends: ['stylelint-config-standard', 'stylelint-config-concentric-order'],
rules: {
'at-rule-no-unknown': [
true,
{
ignoreAtRules: ['mixin', 'if', 'else', 'include', 'extend']
}
],
'max-nesting-depth': 4,
indentation: 4,
// add your custom config here
// https://stylelint.io/user-guide/configuration
'selector-pseudo-element-no-unknown': [
true,
{
ignorePseudoElements: ['v-deep']
}
]
}
}
I dont see anything weird about it. It there a page where i can find the correct order? it is so annoying because when i get a stylelint order error, i usually have to find it in a few tries.
You are extending the stylelint-config-concentric-order community config. This config includes and configures the stylelint-order community plugin. You can find the order of the properties in the repo on GitHub.
You can see Stylelint errors in VS Code using the official Stylelint extension.
And you can have the extension automatically fix problems on save, which will include the order of your properties, using the editor.codeActionsOnSave configuration property:
{
"editor.formatOnSave": true,
"editor.codeActionsOnSave": {
"source.fixAll.stylelint": true
},
"stylelint.validate": ["css", "postcss","scss"],
"css.validate": false,
"scss.validate": false
}
Alternatively, you can run npx stylelint "**/*.scss" --fix" on the command line to automatically fix problems.

How to debug vue.js SFC (Single file component) in vscode, with TypeScript and webpack 4?

For the example, everything seems to be working with chrome debugger extension installed.
When I tried to use:
<script lang="ts">
the source map seems just mess up. Following the instructions here, I can debug in Chrome, but not in vscode anymore.
I used the version 3 vue-cli template with TypeScript in Vue.js Single-File-Components rather than the guide you have linked, but I had a similar problem.
The vue-cli v.3 template ends up outputting TypeScript components' sourcemaps into a '.' folder (but all under webpack://) while the JavaScript components' sourcemaps end up in a 'src' folder. This resulted in the default sourceMapPaths working for the JavaScript SFCs but not the TypeScript SFCs. Therefore, I could set breakpoints in Chrome debugger directly, but not in the original files in VSCode for TypeScript SFCs.
My solution was to correct the mapping via the sourceMapPathOverrides configuration (alternatively, it could be corrected by modifying the build process but this seemed like the simple approach).
In .vscode/launch.json, you can set the appropriate mappings. The config I used ended up looking similar to the following (but you may have to adjust based on your exact setup):
{
"type": "chrome",
"request": "launch",
"name": "ChromeDebug",
"url": "http://localhost:8080",
"webRoot": "${workspaceFolder}",
"breakOnLoad": true,
"sourceMaps": true,
"disableNetworkCache": true,
"sourceMapPathOverrides": {
"webpack:///*": "${webRoot}/*",
"webpack:///./*": "${webRoot}/*",
"webpack:///src/*": "${webRoot}/src/*"
}
}
(The last sourceMapPathOverrides entry is probably redundant. Your link seems to be using a '.://' root output path rather than my 'webpack://' root and you may also need to adjust the webRoot path to wherever your source files are. Don't forget to change the url/port as well, if it differs from my example.)
...
And the following is probably not related to OP's issue, but may be helpful for someone with a similar problem:
When using TypeScript, ensure that you have "sourceMap": true in your tsconfig.json.
If using vue-cli v.3, you may also need to add a vue.config.js file in the project root, such as the following, to change the devtool value from the default:
module.exports = { configureWebpack: { devtool: "source-map" } };

How to setup tern-vim in my project?

I want to setup tern-vim in my project and followed this link https://github.com/ternjs/tern_for_vim/blob/master/doc/tern.txt.
After installation, I created a .tern-project file under the root directory of my project as below.
{
"libs": [
"browser",
"jquery"
],
"loadEagerly": [
"importantfile.js"
],
"plugins": {
"requirejs": {
"baseURL": "./",
"paths": {}
}
}
}
When I open a js file by vim command, I can't use any tern command as below:
|:TernDoc|...................... Look up Documentation
|:TernDocBrowse|................ Browse the Documentation
|:TernType|..................... Perform a type look up
|:TernDef|...................... Look up definition
|:TernDefPreview|............... Look up definition in preview
|:TernDefSplit|................. Look up definition in new split
|:TernDefTab|................... Look up definition in new tab
|:TernRefs|..................... Look up references
|:TernRename|................... Rename identifier
I will get Not an editor command error. Do I need to do any other configuration?

Sublime text 3, Package Controll - cant install packages

I realized like a week ago that I cannot install any new packages via Package Control. I tried everything even reinstalling sublime, while cleaning all files /Library/Application Support/ everything. Still the same problem. Any ideas?
ignored packages updated to: ["Emmet", "Vintage"]
reloading settings Packages/User/Package Control.sublime-settings
reloading settings Packages/User/Preferences.sublime-settings
Package Control: Error downloading package. HTTP exception InvalidCertificateException (Host codeload.github.com returned an invalid certificate ([SSL: CERTIFICATE_VERIFY_FAILED] certificate verify failed (_ssl.c:548))) downloading https://codeload.github.com/sergeche/emmet-sublime/zip/master.
error: Package Control
Unable to download Emmet. Please view the console for more details.
ignored packages updated to: ["Vintage"]
reloading settings Packages/User/Package Control.sublime-settings
reloading settings Packages/User/Preferences.sublime-settings
reloading settings Packages/User/Preferences.sublime-settings
You can change the precedence of the downloader in ~/.config/sublime-text-3/Packages/User/Package Control.sublime-settings.
"downloader_precedence":
{
"linux":
[
"urllib",
"curl",
"wget"
],
"osx":
[
"curl",
"urllib"
],
"windows":
[
"wininet"
]
},
Changing urllib to curl has worked for me.
For OSX:
bhanu's answer is correct but my "Package Control Settings - User" file was not at that exact location. More general instructions:
Open Command Palette (Cmd+Shift+P on Mac)
Type Package Control Settings
Open 'Package Control Settings - Default' and search for downloader_precedence
It probably looks like this - note the default osx downloader is "urllib":
"downloader_precedence": {
"windows": ["wininet"],
"osx": ["urllib"],
"linux": ["urllib", "curl", "wget"]
},
You can't actually edit the Default. Override this setting by going to Command Palette > 'Package Control Settings - User'
Copy-paste the snippet above into the User file (correct indentation and add comma after existing settings if needed) and make "curl" the first osx downloader:
"downloader_precedence": {
"windows": ["wininet"],
"osx": ["curl", "urllib"],
"linux": ["urllib", "curl", "wget"]
},

lein-less not running on figwheel start or when a .less file changes

I'm trying to setup a clojurescript project that uses the lein-less plugin to compile .less files. I should say I'm new to clojurescript. The problem is that it doesn't seem to run. It doesn't run when I run "lein figwheel" and neither when I change a .less file.
This is my project.cljs
(defproject fed-repo "0.1.0"
:description "Frontend Repository"
:dependencies [
[org.clojure/clojure "1.7.0"]
[org.clojure/clojurescript "1.7.170"]
[org.omcljs/om "1.0.0-alpha22"]
]
:plugins [
[lein-less "1.7.5"]
[lein-cljsbuild "1.1.2"]
[lein-figwheel "0.5.0-4"]
]
:less {
:source-paths ["src"]
:target-path "resources/public/css"
}
:hooks [
leiningen.less
leiningen.cljsbuild
]
:cljsbuild {
:builds [
{
:id "dev"
:source-paths ["src"]
:figwheel true
:compiler {
:main "fed-repo.core"
:asset-path "js/out"
:output-to "resources/public/js/main.js"
:output-dir "resources/public/js/out"
}
}
]
}
)
What is wrong with this setup?
Under :less the values for the keys :source-paths and :target-path need to go to actual files. You seem to have stopped at the directory.
Here's a working example:
:less {:source-paths ["src/less/"]
:target-path "resources/public/css/"}
Another issue is that you are not telling Figwheel where to hot code reload css from. Example:
:figwheel { :css-dirs ["resources/public/css"] }
With the set up so far there is still no .less -> .css file generation. You could have a terminal open that is dedicated to running lein less once. After changing the .less file run that command. Alternatively automatic generation can be done with the command lein less auto.