Double dollar when select variable via enter/tab

[ccxdev]

• 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

[mattaningram]

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

[madebyfabian]

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

[ChrisRoss5]

Fix?

[0xAliRaza]

It's so frustrating. ://

[Evertvdw]

This is very annoying indeed, can this be fixed?

[Matix-Media]

This is still not fixed!

[Esensats]

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

[crowrvo]

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]

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 ?

[crowrvo]

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

[luksak]

Nice, that worked. Thank you @crowrvo!

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

[crowrvo]

@luksak done https://github.com/mrmlnc/vscode-scss/pull/171 , i try to make all tests pass and solve some other bugs, but now, i think that is all good.

[e1uone]

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