diff --git a/site/content/docs/02-template-syntax.md b/site/content/docs/02-template-syntax.md
index 3d396f2f2449..ae07c9099388 100644
--- a/site/content/docs/02-template-syntax.md
+++ b/site/content/docs/02-template-syntax.md
@@ -111,6 +111,27 @@ Text can also contain JavaScript expressions:
```
+### Comments
+
+---
+
+You can use HTML comments inside components.
+
+```html
+
+
Hello world
+```
+
+---
+
+Comments beginning with `svelte-ignore` disable warnings for the next block of markup. Usually these are accessibility warnings; make sure that you're disabling them for a good reason.
+
+```html
+
+
+```
+
+
### {#if ...}
```sv
diff --git a/src/compiler/compile/Component.ts b/src/compiler/compile/Component.ts
index 5b08b795ceeb..28e8535c6396 100644
--- a/src/compiler/compile/Component.ts
+++ b/src/compiler/compile/Component.ts
@@ -23,6 +23,7 @@ import get_object from './utils/get_object';
import unwrap_parens from './utils/unwrap_parens';
import Slot from './nodes/Slot';
import { Node as ESTreeNode } from 'estree';
+import add_to_set from './utils/add_to_set';
interface ComponentOptions {
namespace?: string;
@@ -70,6 +71,8 @@ function remove_node(code: MagicString, start: number, end: number, body: Node,
export default class Component {
stats: Stats;
warnings: Warning[];
+ ignores: Set;
+ ignore_stack: Set[] = [];
ast: Ast;
source: string;
@@ -442,6 +445,10 @@ export default class Component {
message: string;
}
) {
+ if (this.ignores && this.ignores.has(warning.code)) {
+ return;
+ }
+
if (!this.locator) {
this.locator = getLocator(this.source, { offsetLine: 1 });
}
@@ -1253,6 +1260,17 @@ export default class Component {
message
});
}
+
+ push_ignores(ignores) {
+ this.ignores = new Set(this.ignores || []);
+ add_to_set(this.ignores, ignores);
+ this.ignore_stack.push(this.ignores);
+ }
+
+ pop_ignores() {
+ this.ignore_stack.pop();
+ this.ignores = this.ignore_stack[this.ignore_stack.length - 1];
+ }
}
function process_component_options(component: Component, nodes) {
diff --git a/src/compiler/compile/nodes/Comment.ts b/src/compiler/compile/nodes/Comment.ts
index 97a28f25a122..161150bd2560 100644
--- a/src/compiler/compile/nodes/Comment.ts
+++ b/src/compiler/compile/nodes/Comment.ts
@@ -1,11 +1,17 @@
import Node from './shared/Node';
+const pattern = /^\s*svelte-ignore\s+([\s\S]+)\s*$/m;
+
export default class Comment extends Node {
type: 'Comment';
data: string;
+ ignores: string[];
constructor(component, parent, scope, info) {
super(component, parent, scope, info);
this.data = info.data;
+
+ const match = pattern.exec(this.data);
+ this.ignores = match ? match[1].split(/[^\S]/).map(x => x.trim()).filter(Boolean) : [];
}
}
\ No newline at end of file
diff --git a/src/compiler/compile/nodes/shared/map_children.ts b/src/compiler/compile/nodes/shared/map_children.ts
index 71d764a889c5..4072b176e528 100644
--- a/src/compiler/compile/nodes/shared/map_children.ts
+++ b/src/compiler/compile/nodes/shared/map_children.ts
@@ -42,9 +42,20 @@ function get_constructor(type) {
export default function map_children(component, parent, scope, children: Node[]) {
let last = null;
+ let ignores = [];
+
return children.map(child => {
const constructor = get_constructor(child.type);
+
+ const use_ignores = child.type !== 'Text' && child.type !== 'Comment' && ignores.length;
+
+ if (use_ignores) component.push_ignores(ignores);
const node = new constructor(component, parent, scope, child);
+ if (use_ignores) component.pop_ignores(), ignores = [];
+
+ if (node.type === 'Comment' && node.ignores.length) {
+ ignores.push(...node.ignores);
+ }
if (last) last.next = node;
node.prev = last;
diff --git a/test/validator/samples/ignore-warning/input.svelte b/test/validator/samples/ignore-warning/input.svelte
new file mode 100644
index 000000000000..c4e7556d74e6
--- /dev/null
+++ b/test/validator/samples/ignore-warning/input.svelte
@@ -0,0 +1,7 @@
+
+
+

+
+
+
+
\ No newline at end of file
diff --git a/test/validator/samples/ignore-warning/warnings.json b/test/validator/samples/ignore-warning/warnings.json
new file mode 100644
index 000000000000..6123fafae8a7
--- /dev/null
+++ b/test/validator/samples/ignore-warning/warnings.json
@@ -0,0 +1,32 @@
+[
+ {
+ "code": "a11y-distracting-elements",
+ "end": {
+ "character": 131,
+ "column": 49,
+ "line": 4
+ },
+ "message": "A11y: Avoid