make ssr bound values more explicit

Drop the boolean flag from add attribute for ssr to
be more explicit. This fixes the issue of rendering
a bound number 0, which was previously omitted.
pull/4559/head
Jonniek 6 years ago
parent b7366c42cd
commit c35167d6a2

@ -124,7 +124,7 @@ export default function(node: Element, renderer: Renderer, options: RenderOption
node_contents = x`${snippet} || ""`;
} else {
const snippet = expression.node;
renderer.add_expression(x`@add_attribute("${name}", ${snippet}, 1)`);
renderer.add_expression(x`@add_attribute("${name}", ${snippet}, 0)`);
}
});

@ -128,7 +128,7 @@ export function create_ssr_component(fn) {
}
export function add_attribute(name, value, boolean) {
if (value == null || (boolean && !value && value !== 0)) return '';
if (value == null || (boolean && !value)) return '';
return ` ${name}${value === true ? '' : `=${typeof value === 'string' ? JSON.stringify(escape(value)) : `"${value}"`}`}`;
}

@ -9,7 +9,7 @@ export default {
`,
ssrHtml: `
<input>
<input value="">
<p></p>
`,

@ -11,6 +11,14 @@ export default {
</select>
`,
ssrHtml: `
<select value="">
<option value='A'>A</option>
<option value='B'>B</option>
<option value='C'>C</option>
</select>
`,
async test({ assert, component, target, window }) {
const select = target.querySelector('select');
const options = target.querySelectorAll('option');

@ -13,13 +13,13 @@ export default {
ssrHtml: `
<div>
<input type="checkbox"><p>one</p>
<input type="checkbox" checked="false"><p>one</p>
</div>
<div>
<input type="checkbox"><p>two</p>
<input type="checkbox" checked="false"><p>two</p>
</div>
<div>
<input type="checkbox"><p>three</p>
<input type="checkbox" checked="false"><p>three</p>
</div>
`,

@ -25,10 +25,10 @@ export default {
<input type="checkbox" checked><p>one</p>
</div>
<div>
<input type="checkbox"><p>two</p>
<input type="checkbox" checked="false"><p>two</p>
</div>
<div>
<input type="checkbox"><p>three</p>
<input type="checkbox" checked="false"><p>three</p>
</div>
<p>1 completed</p>
`,

@ -17,6 +17,11 @@ export default {
<input type="checkbox">
`,
ssrHtml: `
<input type="checkbox" checked="false">
<input type="checkbox" checked="false">
`,
test({ assert, component, target, window }) {
const { cats } = component;
const newCats = cats.slice();

@ -26,7 +26,7 @@ export default {
ssrHtml: `
<div>
<input type="checkbox">
<input type="checkbox" checked="false">
<input type="text" value=one><p>one</p>
</div>
<div>
@ -34,7 +34,7 @@ export default {
<input type="text" value=two><p>two</p>
</div>
<div>
<input type="checkbox">
<input type="checkbox" checked="false">
<input type="text" value=three><p>three</p>
</div>

@ -1,3 +1,5 @@
export default {
html: '<input type="text">'
html: '<input type="text">',
ssrHtml: '<input type="text" value="">'
};

@ -4,6 +4,11 @@ export default {
<label>lastname <input></label>
`,
ssrHtml: `
<label>firstname <input value=""></label>
<label>lastname <input value=""></label>
`,
async test({ assert, component, target, window }) {
const input = new window.Event('input');
const inputs = target.querySelectorAll('input');

@ -6,6 +6,13 @@ export default {
</div>
`,
ssrHtml: `
<div>
<input value="" />
<div class="foo"></div>
</div>
`,
async test({ assert, component, target }) {
component.value = 'foo';

@ -28,7 +28,7 @@ export default {
</div>
<div class="todo ">
<input type="checkbox">
<input type="checkbox" checked="false">
<input type="text" value="Find life's true purpose">
</div>
`,

@ -6,6 +6,13 @@ export default {
<button>click me</button>
`,
ssrHtml: `
<input value="">
<div></div>
<div>simple</div>
<button>click me</button>
`,
async test({ assert, component, target, window }) {
const input = target.querySelector('input');
const button = target.querySelector('button');

@ -6,6 +6,13 @@ export default {
<button>click me</button>
`,
ssrHtml: `
<div></div>
<div>simple</div>
<input value="">
<button>click me</button>
`,
async test({ assert, component, target, window }) {
const input = target.querySelector('input');
const button = target.querySelector('button');

Loading…
Cancel
Save