mirror of https://github.com/sveltejs/svelte
parent
2ce702293e
commit
d21d020648
@ -0,0 +1,8 @@
|
||||
<svelte:options tag="custom-element" shadowdom="closed" />
|
||||
|
||||
<script>
|
||||
export let name;
|
||||
</script>
|
||||
|
||||
<h1>Hello {name}!</h1>
|
||||
|
@ -0,0 +1,13 @@
|
||||
import * as assert from 'assert';
|
||||
import './main.svelte';
|
||||
|
||||
export default function (target) {
|
||||
target.innerHTML = '<custom-element name="world"></custom-element>';
|
||||
const el = target.querySelector('custom-element');
|
||||
|
||||
assert.equal(el.name, 'world');
|
||||
|
||||
const h1 = el._root.querySelector('h1');
|
||||
assert.equal(h1.textContent, 'Hello world');
|
||||
assert.equal(el.shadowRoot, null);
|
||||
}
|
@ -0,0 +1,10 @@
|
||||
<svelte:options tag="custom-element" shadowdom="none" />
|
||||
|
||||
<style>
|
||||
h1 {
|
||||
color:red;
|
||||
}
|
||||
</style>
|
||||
|
||||
<h1>Hello World</h1>
|
||||
|
@ -0,0 +1,10 @@
|
||||
import * as assert from 'assert';
|
||||
import './main.svelte';
|
||||
|
||||
export default function (target) {
|
||||
target.innerHTML = '<custom-element></custom-element>';
|
||||
const el = target.querySelector('custom-element');
|
||||
const h1 = el.querySelector('h1');
|
||||
const colour = getComputedStyle(h1).color;
|
||||
assert.equal(colour,"rgb(255, 0, 0)");
|
||||
}
|
@ -0,0 +1,8 @@
|
||||
<svelte:options tag="custom-element" shadowdom="none" />
|
||||
|
||||
<script>
|
||||
export let name;
|
||||
</script>
|
||||
|
||||
<h1>Hello {name}!</h1>
|
||||
|
@ -0,0 +1,12 @@
|
||||
import * as assert from 'assert';
|
||||
import './main.svelte';
|
||||
|
||||
export default function (target) {
|
||||
target.innerHTML = '<custom-element name="world"></custom-element>';
|
||||
const el = target.querySelector('custom-element');
|
||||
|
||||
assert.equal(el.name, 'world');
|
||||
|
||||
const h1 = el.querySelector('h1');
|
||||
assert.equal(h1.textContent, 'Hello world!');
|
||||
}
|
Loading…
Reference in new issue