update class directive tests

test/runtime/samples/class-helper/_config.js

@@ -2,13 +2,14 @@ export default {
 	props: {
 		user: { active: true }
 	},
+
 	html: `<div class="active"></div>`,
 
-	test ( assert, component, target, window ) {
+	test(assert, component, target, window) {
 		component.user = { active: false };
 
-		assert.htmlEqual( target.innerHTML, `
+		assert.htmlEqual(target.innerHTML, `
 			<div class></div>
-		` );
+		`);
 	}
 };

test/runtime/samples/class-helper/main.html

@@ -6,4 +6,4 @@
 }
 </script>
 
-<div class:active="isActive(user)"></div>
+<div class:active={isActive(user)}></div>

test/runtime/samples/class-in-each/main.html

@@ -1,3 +1,3 @@
 {#each things as thing}
-	<div class:selected="selected === thing"></div>
+	<div class:selected="{selected === thing}"></div>
 {/each}

test/runtime/samples/class-shortcut-with-class/_config.js

@@ -1,16 +1,17 @@
 export default {
 	props: {
-		"is-active": true,
-		isSelected: true,
+		foo: true,
+		bar: true,
 		myClass: 'one two'
 	},
-	html: `<div class="one two is-active isSelected"></div>`,
 
-	test ( assert, component, target, window ) {
-		component.undefined = false;
+	html: `<div class="one two foo bar"></div>`,
 
-		assert.htmlEqual( target.innerHTML, `
-			<div class="one two isSelected"></div>
-		` );
+	test(assert, component, target, window) {
+		component.foo = false;
+
+		assert.htmlEqual(target.innerHTML, `
+			<div class="one two bar"></div>
+		`);
 	}
 };

test/runtime/samples/class-shortcut-with-class/main.html

@@ -1 +1 @@
-<div class="{ myClass }" class:is-active class:isSelected class:not-used></div>
+<div class={myClass} class:foo class:bar class:unused></div>

test/runtime/samples/class-shortcut/_config.js

@@ -1,15 +1,16 @@
 export default {
 	props: {
-		"is-active": true,
-		isSelected: true
+		foo: true,
+		bar: true
 	},
-	html: `<div class="is-active isSelected"></div>`,
 
-	test ( assert, component, target, window ) {
-		component.undefined = false;
+	html: `<div class="foo bar"></div>`,
 
-		assert.htmlEqual( target.innerHTML, `
-			<div class="isSelected"></div>
-		` );
+	test(assert, component, target, window) {
+		component.foo = false;
+
+		assert.htmlEqual(target.innerHTML, `
+			<div class="bar"></div>
+		`);
 	}
 };

test/runtime/samples/class-shortcut/main.html

@@ -1 +1 @@
-<div class:is-active class:isSelected class:not-used></div>
+<div class:foo class:bar class:unused></div>

test/runtime/samples/class-with-attribute/main.html

@@ -1 +1 @@
-<div class="one" class:two="true" class:three="true"></div>
+<div class="one" class:two={true} class:three={true}></div>

test/runtime/samples/class-with-dynamic-attribute/_config.js

@@ -2,13 +2,14 @@ export default {
 	props: {
 		myClass: 'one two'
 	},
+
 	html: `<div class="one two three"></div>`,
 
-	test ( assert, component, target, window ) {
+	test(assert, component, target, window) {
 		component.myClass = 'one';
 
-		assert.htmlEqual( target.innerHTML, `
+		assert.htmlEqual(target.innerHTML, `
 			<div class="one three"></div>
-		` );
+		`);
 	}
 };

test/runtime/samples/class-with-dynamic-attribute/main.html

@@ -1 +1 @@
-<div class="{ myClass }" class:three="true"></div>
+<div class={myClass} class:three={true}></div>