mrmlnc/vscode-scss

Double dollar when select variable via enter/tab

ccxdev opened this issue · 13 comments

  • VS Code Version: 1.46.0 - Insider
  • SCSS IntelliSense Version: 0.9.0
  • Operating System: Windows 10 Pro 1909

Reproducible Case:
Trying add color: $, after $ types, I am searching for var, and select it via enter/tab, after that added another dollar pasted before already typed $.

Steps to Reproduce:

  1. Create _vars.scss, include to main.scss
  2. Try to add any property to selector with variable
  3. Here we go
    image
    image

I'm having this issue as well, is this new? I don't remember it behaving this way before.

Having the same issue, it's really annoying. Are there any news about it?

Fix?

It's so frustrating. ://

This is very annoying indeed, can this be fixed?

This is still not fixed!

Still not fixed... Using Vue CLI (vue 3) with sass 1.32.7, sass-loader 12.0.0 (.scss files)

i think that is more a bug in VsCode than the extension it's self, they can't replace symbols with string, playing with the code a little bit i make this work very nice with global vars, just removing the $ from suggestion string (they still need a $ to trigger the suggestion window call)

// services/parser.ts
async function findDocumentSymbols(
	document: TextDocument,
	ast: INode
): Promise<IDocumentSymbols> {
	const symbols = ls.findDocumentSymbols(document, ast);
	const links = await findDocumentLinks(document, ast);

	const result: IDocumentSymbols = {
		functions: [],
		imports: convertLinksToImports(links),
		mixins: [],
		variables: [],
	};

	for (const symbol of symbols) {
		const position = symbol.location.range.start;
		const offset = document.offsetAt(symbol.location.range.start);

		if (symbol.kind === SymbolKind.Variable) {
			result.variables.push({
				name: symbol.name.replace("$", ""), // Removing $ from var name
				offset,
				position,
				value: getVariableValue(ast, offset),
			});
		} else if (symbol.kind === SymbolKind.Method) {
			result.mixins.push({
				name: symbol.name,
				offset,
				position,
				parameters: getMethodParameters(ast, offset),
			});
		} else if (symbol.kind === SymbolKind.Function) {
			result.functions.push({
				name: symbol.name,
				offset,
				position,
				parameters: getMethodParameters(ast, offset),
			});
		}
	}

	return result;
}

I tested this in a vue 3 project with scss and script setup.
Some Tests

dsvgl commented

Nice work @crowrvo!
What's the best way to use your patch?
Clone this repo, apply your changes and compile. Take the output and paste it in /Users/USERNAME/.vscode/extensions/mrmlnc.vscode-scss-0.10.0/out/unsafe/services/parser.js
?

@dsvgl i will do a pull request, but just write the replace in the compiled parse.js solve the problem

luksak commented

Nice, that worked. Thank you @crowrvo!

Could you do the PR? Otherwise I can do it.

@luksak done #171 , i try to make all tests pass and solve some other bugs, but now, i think that is all good.

e1uone commented

Omg, if the PR will be merged me and our team will be happy guys, please don't drop this case