Skip to content

Commit

Permalink
Fixes
Browse files Browse the repository at this point in the history
  • Loading branch information
ecmel committed Dec 26, 2020
1 parent d189bb7 commit cf0f713
Show file tree
Hide file tree
Showing 4 changed files with 23 additions and 20 deletions.
4 changes: 2 additions & 2 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
# Visual Studio Code CSS Intellisense for HTML

HTML `id` and `class` attributes completion and validation for VS Code.
HTML `id` and `class` attributes completion and validation for Visual Studio Code.

## Features

Expand Down Expand Up @@ -78,7 +78,7 @@ Template inheritance is supported for the following tags:
@extends('base')
{{< base }}
{{< base }}
```

Only one level of inheritance is supported:
Expand Down
14 changes: 8 additions & 6 deletions src/completion.ts
Original file line number Diff line number Diff line change
Expand Up @@ -27,20 +27,22 @@ export class ClassCompletionItemProvider implements CompletionItemProvider, Disp
readonly cache = new Map<string, Map<string, CompletionItem>>();
readonly extends = new Map<string, Set<string>>();
readonly watchers = new Map<string, Disposable>();
readonly collection = languages.createDiagnosticCollection("vscode-html-css");
readonly collection = languages.createDiagnosticCollection();
readonly isRemote = /^https?:\/\//i;
readonly canComplete = /(id|class|className)\s*=\s*("|')(?:(?!\2).)*$/si;
readonly findLinkRel = /rel\s*=\s*("|')((?:(?!\1).)+)\1/si;
readonly findLinkHref = /href\s*=\s*("|')((?:(?!\1).)+)\1/si;
readonly findExtended = /(?:{{<|{%\s*extends|@extends\s*\()\s*("|')?([./A-Za-z_0-9\\\-]+)\1\s*(?:\)|%}|}})/i;

constructor() {
constructor(enabledLanguages: string[]) {
let debounce: NodeJS.Timeout;

this.watchers.set("changed", workspace.onDidChangeTextDocument(e => {
clearTimeout(debounce);
debounce = setTimeout(() => this.validate(e.document), 1000);
}));
workspace.onDidChangeTextDocument(e => {
if (enabledLanguages.includes(e.document.languageId)) {
clearTimeout(debounce);
debounce = setTimeout(() => this.validate(e.document), 1000);
}
});
}

dispose() {
Expand Down
2 changes: 1 addition & 1 deletion src/extension.ts
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import { ExtensionContext, languages, workspace, commands } from "vscode";
export function activate(context: ExtensionContext) {
const config = workspace.getConfiguration("css");
const enabledLanguages = config.get<string[]>("enabledLanguages", ["html"]);
const provider = new ClassCompletionItemProvider();
const provider = new ClassCompletionItemProvider(enabledLanguages);

context.subscriptions.push(
languages.registerCompletionItemProvider(
Expand Down
23 changes: 12 additions & 11 deletions src/test/suite/completion.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -5,19 +5,20 @@ import { CompletionItem, Position, Uri } from "vscode";

suite("ClassCompletionItemProvider Test Suite", () => {

const langs = ["html"];
const position = new Position(0, 0);
const token = new MockCancellationToken(false);
const context = new MockCompletionContext();

test("RegEx: isRemote", () => {
const provider = new ClassCompletionItemProvider();
const provider = new ClassCompletionItemProvider(langs);

assert.strictEqual(provider.isRemote.test("http://example.com/example.css"), true);
assert.strictEqual(provider.isRemote.test("https://example.com/example.css"), true);
});

test("RegEx: canComplete", () => {
const provider = new ClassCompletionItemProvider();
const provider = new ClassCompletionItemProvider(langs);

assert.strictEqual(provider.canComplete.test(""), false);
assert.strictEqual(provider.canComplete.test("class=\""), true);
Expand Down Expand Up @@ -52,47 +53,47 @@ suite("ClassCompletionItemProvider Test Suite", () => {
});

test("RegEx: findLinkRel", () => {
const provider = new ClassCompletionItemProvider();
const provider = new ClassCompletionItemProvider(langs);

assert.strictEqual(provider.findLinkRel.exec(`
<link rel="stylesheet" href="http://example.com/example.css">
"`)?.[2], "stylesheet");
});

test("RegEx: findLinkHref", () => {
const provider = new ClassCompletionItemProvider();
const provider = new ClassCompletionItemProvider(langs);

assert.strictEqual(provider.findLinkHref.exec(`
<link rel="stylesheet" href="http://example.com/example.css">
"`)?.[2], "http://example.com/example.css");
});

test("RegEx: findExtended (Twig)", () => {
const provider = new ClassCompletionItemProvider();
const provider = new ClassCompletionItemProvider(langs);

assert.strictEqual(provider.findExtended.exec(`
{% extends "base" %}
`)?.[2], "base");
});

test("RegEx: findExtended (Mustache)", () => {
const provider = new ClassCompletionItemProvider();
const provider = new ClassCompletionItemProvider(langs);

assert.strictEqual(provider.findExtended.exec(`
{{< base }}
`)?.[2], "base");
});

test("RegEx: findExtended (Blade)", () => {
const provider = new ClassCompletionItemProvider();
const provider = new ClassCompletionItemProvider(langs);

assert.strictEqual(provider.findExtended.exec(`
@extends('base')
`)?.[2], "base");
});

test("Rejects outside class attribute", (done) => {
const provider = new ClassCompletionItemProvider();
const provider = new ClassCompletionItemProvider(langs);
const document = new MockDocument("<a class=\"\"></a>");

const result = provider.provideCompletionItems(
Expand All @@ -105,7 +106,7 @@ suite("ClassCompletionItemProvider Test Suite", () => {
});

test("Completes from style tag", async () => {
const provider = new ClassCompletionItemProvider();
const provider = new ClassCompletionItemProvider(langs);
const document = new MockDocument("<style>.test{}</style><a class=\"");

const items = await (provider.provideCompletionItems(
Expand All @@ -118,7 +119,7 @@ suite("ClassCompletionItemProvider Test Suite", () => {
});

test("Completes from link tag", async () => {
const provider = new ClassCompletionItemProvider();
const provider = new ClassCompletionItemProvider(langs);
const document = new MockDocument(`
<link
href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
Expand All @@ -142,7 +143,7 @@ suite("ClassCompletionItemProvider Test Suite", () => {
"https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
];
}
}();
}(langs);

const document = new MockDocument("<a class=\"");

Expand Down

0 comments on commit cf0f713

Please sign in to comment.