msb-public
/
svelte
mirror of https://github.com/sveltejs/svelte
1
0
Code Issues Projects Releases Wiki Activity

Merge branch 'master' into pr/5013

Browse Source
pull/5013/head
Conduitry 5 years ago
parent c98c5e400f 55c809624d
commit f10eb9d4bb
19 changed files with 217 additions and 22 deletions
Show Stats Download Patch File Download Diff File

4
CHANGELOG.md
Unescape View File

@ -2,10 +2,14 @@
## Unreleased
* Fix placement of `{@html}` when used at the root of a slot or the root of a component ([#5012](https://github.com/sveltejs/svelte/issues/5012))
* Fix handling of `import`ed value that is used as a store and is also mutated ([#5019](https://github.com/sveltejs/svelte/issues/5019))
* Do not display `a11y-missing-content` warning on elements with `contenteditable` bindings ([#5020](https://github.com/sveltejs/svelte/issues/5020))
* Fix handling of `this` in inline function expressions in the template ([#5033](https://github.com/sveltejs/svelte/issues/5033))
* Fix collapsing HTML with static content ([#5040](https://github.com/sveltejs/svelte/issues/5040))
* Update `<select>` with one-way `value` binding when the available `<option>`s change ([#5051](https://github.com/sveltejs/svelte/issues/5051))
* Fix published `tweened` types so the `.set()` and `.update()` options are optional ([#5062](https://github.com/sveltejs/svelte/issues/5062))
* Fix contextual `bind:this` inside `{#each}` block ([#5067](https://github.com/sveltejs/svelte/issues/5067))
## 3.23.2

4
site/rollup.config.js
Unescape View File

@ -13,6 +13,10 @@ const mode = process.env.NODE_ENV;
const dev = mode === 'development';
const legacy = !!process.env.SAPPER_LEGACY_BUILD;
if (!dev && !process.env.MAPBOX_ACCESS_TOKEN) {
throw new Error('MAPBOX_ACCESS_TOKEN is missing. Please add the token in the .env file before generating the production build.');
}
const onwarn = (warning, onwarn) => (warning.code === 'CIRCULAR_DEPENDENCY' && /[/\\]@sapper[/\\]/.test(warning.message)) || onwarn(warning);
const dedupe = importee => importee === 'svelte' || importee.startsWith('svelte/');

18
src/compiler/compile/render_dom/wrappers/Element/index.ts
Unescape View File

@ -6,7 +6,6 @@ import { is_void, sanitize } from '../../../../utils/names';
import FragmentWrapper from '../Fragment';
import { escape_html, string_literal } from '../../../utils/stringify';
import TextWrapper from '../Text';
import TagWrapper from '../shared/Tag';
import fix_attribute_casing from './fix_attribute_casing';
import { b, x, p } from 'code-red';
import { namespaces } from '../../../../utils/namespaces';
@ -26,6 +25,8 @@ import { Identifier } from 'estree';
import EventHandler from './EventHandler';
import { extract_names } from 'periscopic';
import Action from '../../../nodes/Action';
import MustacheTagWrapper from '../MustacheTag';
import RawMustacheTagWrapper from '../RawMustacheTag';
interface BindingGroup {
events: string[];
@ -337,8 +338,7 @@ export default class ElementWrapper extends Wrapper {
if (!this.node.namespace && (this.can_use_innerhtml || can_use_textcontent) && this.fragment.nodes.length > 0) {
if (this.fragment.nodes.length === 1 && this.fragment.nodes[0].node.type === 'Text') {
block.chunks.create.push(
// @ts-ignore todo: should it be this.fragment.nodes[0].node.data instead?
b`${node}.textContent = ${string_literal(this.fragment.nodes[0].data)};`
b`${node}.textContent = ${string_literal((this.fragment.nodes[0] as TextWrapper).data)};`
);
} else {
const state = {
@ -926,9 +926,9 @@ export default class ElementWrapper extends Wrapper {
}
}
function to_html(wrappers: Array<ElementWrapper | TextWrapper | TagWrapper>, block: Block, literal: any, state: any, can_use_raw_text?: boolean) {
function to_html(wrappers: Array<ElementWrapper | TextWrapper | MustacheTagWrapper | RawMustacheTagWrapper>, block: Block, literal: any, state: any, can_use_raw_text?: boolean) {
wrappers.forEach(wrapper => {
if (wrapper.node.type === 'Text') {
if (wrapper instanceof TextWrapper) {
if ((wrapper as TextWrapper).use_space()) state.quasi.value.raw += ' ';
const parent = wrapper.node.parent as Element;
@ -939,13 +939,13 @@ function to_html(wrappers: Array<ElementWrapper | TextWrapper | TagWrapper>, blo
can_use_raw_text
);
state.quasi.value.raw += (raw ? wrapper.node.data : escape_html(wrapper.node.data))
state.quasi.value.raw += (raw ? wrapper.data : escape_html(wrapper.data))
.replace(/\\/g, '\\\\')
.replace(/`/g, '\\`')
.replace(/\$/g, '\\$');
}
else if (wrapper.node.type === 'MustacheTag' || wrapper.node.type === 'RawMustacheTag' ) {
else if (wrapper instanceof MustacheTagWrapper || wrapper instanceof RawMustacheTagWrapper) {
literal.quasis.push(state.quasi);
literal.expressions.push(wrapper.node.expression.manipulate(block));
state.quasi = {
@ -984,8 +984,8 @@ function to_html(wrappers: Array<ElementWrapper | TextWrapper | TagWrapper>, blo
state.quasi.value.raw += '>';
if (!(wrapper as ElementWrapper).void) {
to_html((wrapper as ElementWrapper).fragment.nodes as Array<ElementWrapper | TextWrapper>, block, literal, state);
if (!wrapper.void) {
to_html(wrapper.fragment.nodes as Array<ElementWrapper | TextWrapper>, block, literal, state);
state.quasi.value.raw += `</${wrapper.node.name}>`;
}

2
src/compiler/compile/render_dom/wrappers/RawMustacheTag.ts
Unescape View File

@ -39,7 +39,7 @@ export default class RawMustacheTagWrapper extends Tag {
}
else {
const needs_anchor = in_head || (this.next && !this.next.is_dom_node());
const needs_anchor = in_head || (this.next ? !this.next.is_dom_node() : (!this.parent || !this.parent.is_dom_node()));
const html_tag = block.get_unique_name('html_tag');
const html_anchor = needs_anchor && block.get_unique_name('html_anchor');

3
src/compiler/compile/render_dom/wrappers/shared/bind_this.ts
Unescape View File

@ -11,7 +11,7 @@ export default function bind_this(component: Component, block: Block, binding: B
block.renderer.add_to_context(fn.name);
const callee = block.renderer.reference(fn.name);
const { contextual_dependencies, mutation, lhs } = binding.handler;
const { contextual_dependencies, mutation } = binding.handler;
const dependencies = binding.get_dependencies();
const body = b`
@ -29,7 +29,6 @@ export default function bind_this(component: Component, block: Block, binding: B
}));
component.partly_hoisted.push(b`
function ${fn}($$value, ${params}) {
if (${lhs} === $$value) return;
@binding_callbacks[$$value ? 'unshift' : 'push'](() => {
${body}
});

8
src/runtime/motion/tweened.ts
Unescape View File

@ -64,9 +64,9 @@ interface Options<T> {
type Updater<T> = (target_value: T, value: T) => T;
interface Tweened<T> extends Readable<T> {
set(value: T, opts: Options<T>): Promise<void>;
set(value: T, opts?: Options<T>): Promise<void>;
update(updater: Updater<T>, opts: Options<T>): Promise<void>;
update(updater: Updater<T>, opts?: Options<T>): Promise<void>;
}
export function tweened<T>(value?: T, defaults: Options<T> = {}): Tweened<T> {
@ -75,7 +75,7 @@ export function tweened<T>(value?: T, defaults: Options<T> = {}): Tweened<T> {
let task: Task;
let target_value = value;
function set(new_value: T, opts: Options<T>) {
function set(new_value: T, opts?: Options<T>) {
if (value == null) {
store.set(value = new_value);
return Promise.resolve();
@ -137,7 +137,7 @@ export function tweened<T>(value?: T, defaults: Options<T> = {}): Tweened<T> {
return {
set,
update: (fn, opts: Options<T>) => set(fn(target_value, value), opts),
update: (fn, opts?: Options<T>) => set(fn(target_value, value), opts),
subscribe: store.subscribe
};
}

4
test/js/samples/bind-open/expected.js
Unescape View File

@ -18,9 +18,7 @@ function create_fragment(ctx) {
return {
c() {
details = element("details");
details.innerHTML = `<summary>summary</summary>content
`;
details.innerHTML = `<summary>summary</summary>content`;
},
m(target, anchor) {
insert(target, details, anchor);

53
test/runtime/samples/binding-this-each-block-property-2/_config.js
Unescape View File

@ -0,0 +1,53 @@
let calls = [];
function callback(refs) {
calls.push(refs.map(({ ref }) => ({ ref })));
}
export default {
html: ``,
props: {
callback,
},
after_test() {
calls = [];
},
async test({ assert, component, target }) {
assert.equal(calls.length, 1);
assert.equal(calls[0].length, 0);
await component.addItem();
let divs = target.querySelectorAll("div");
assert.equal(calls.length, 3);
assert.equal(calls[1].length, 1);
assert.equal(calls[1][0].ref, null);
assert.equal(calls[2].length, 1);
assert.equal(calls[2][0].ref, divs[0]);
await component.addItem();
divs = target.querySelectorAll("div");
assert.equal(calls.length, 5);
assert.equal(calls[3].length, 2);
assert.equal(calls[3][0].ref, divs[0]);
assert.equal(calls[3][1].ref, null);
assert.equal(calls[4].length, 2);
assert.equal(calls[4][0].ref, divs[0]);
assert.equal(calls[4][1].ref, divs[1]);
await component.addItem();
divs = target.querySelectorAll("div");
assert.equal(calls.length, 7);
assert.equal(calls[5].length, 3);
assert.equal(calls[5][0].ref, divs[0]);
assert.equal(calls[5][1].ref, divs[1]);
assert.equal(calls[5][2].ref, null);
assert.equal(calls[6].length, 3);
assert.equal(calls[6][0].ref, divs[0]);
assert.equal(calls[6][1].ref, divs[1]);
assert.equal(calls[6][2].ref, divs[2]);
},
};

17
test/runtime/samples/binding-this-each-block-property-2/main.svelte
Unescape View File

@ -0,0 +1,17 @@
<script>
import { tick } from 'svelte';
let refs = [];
export function addItem() {
refs = refs.concat({ ref: null });
return tick();
}
export let callback;
$: callback(refs);
</script>
{#each refs as xxx}
<div bind:this={xxx.ref} />
{/each}

8
test/runtime/samples/innerhtml-with-comments/_config.js
Unescape View File

@ -0,0 +1,8 @@
export default {
html: `
<span>
Style:
<a href="https://getbootstrap.com/" target="_blank">Bootstrap</a>.
</span>
`
};

5
test/runtime/samples/innerhtml-with-comments/main.svelte
Unescape View File

@ -0,0 +1,5 @@
<span>
Style:
<!-- prettier-ignore -->
<a href="https://getbootstrap.com/" target="_blank">Bootstrap</a>.
</span>

5
test/runtime/samples/raw-mustache-as-root/RawMustache.svelte
Unescape View File

@ -0,0 +1,5 @@
<script>
export let content;
</script>
{@html content}

33
test/runtime/samples/raw-mustache-as-root/_config.js
Unescape View File

@ -0,0 +1,33 @@
export default {
html: `
<button>Switch</button>
<p>Another first line</p>
<p>This line should be last.</p>
`,
async test({ assert, target, window }) {
const btn = target.querySelector("button");
const clickEvent = new window.MouseEvent("click");
await btn.dispatchEvent(clickEvent);
assert.htmlEqual(
target.innerHTML,
`
<button>Switch</button>
<p>First line</p>
<p>This line should be last.</p>
`
);
await btn.dispatchEvent(clickEvent);
assert.htmlEqual(
target.innerHTML,
`
<button>Switch</button>
<p>Another first line</p>
<p>This line should be last.</p>
`
);
},
};

17
test/runtime/samples/raw-mustache-as-root/main.svelte
Unescape View File

@ -0,0 +1,17 @@
<script>
import RawMustache from './RawMustache.svelte';
let content1 = `<p>First line</p>`;
let content2 = `<p>Another first line</p>`;
let show = false;
$: content = show ? content1 : content2;
</script>
<button on:click={() => show = !show}>
Switch
</button>
<RawMustache {content} />
<p>This line should be last.</p>

2
test/runtime/samples/raw-mustache-before-element/Component.svelte
Unescape View File

@ -0,0 +1,2 @@
<slot />
<p>This line should be last.</p>

32
test/runtime/samples/raw-mustache-before-element/_config.js
Unescape View File

@ -1,3 +1,33 @@
export default {
html: `<p>x<span>baz</span></p>`
html: `
<button>Switch</button>
<p>Another first line</p>
<p>This line should be last.</p>
`,
async test({ assert, target, window }) {
const btn = target.querySelector("button");
const clickEvent = new window.MouseEvent("click");
await btn.dispatchEvent(clickEvent);
assert.htmlEqual(
target.innerHTML,
`
<button>Switch</button>
<p>First line</p>
<p>This line should be last.</p>
`
);
await btn.dispatchEvent(clickEvent);
assert.htmlEqual(
target.innerHTML,
`
<button>Switch</button>
<p>Another first line</p>
<p>This line should be last.</p>
`
);
},
};

18
test/runtime/samples/raw-mustache-before-element/main.svelte
Unescape View File

@ -1 +1,17 @@
<p>{@html 'x'}<span>baz</span></p>
<script>
import Component from './Component.svelte';
let content1 = `<p>First line</p>`;
let content2 = `<p>Another first line</p>`
let show = false;
$: content = show ? content1 : content2;
</script>
<button on:click={() => show = !show}>
Switch
</button>
<Component>
{@html content}
</Component>

3
test/runtime/samples/raw-mustache-inside-slot/_config.js
Unescape View File

@ -0,0 +1,3 @@
export default {
html: `<p>x<span>baz</span></p>`
};

1
test/runtime/samples/raw-mustache-inside-slot/main.svelte
Unescape View File

@ -0,0 +1 @@
<p>{@html 'x'}<span>baz</span></p>
Write Preview
Loading…
Cancel
Save