Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix #708 #709

Merged
merged 12 commits into from
Jul 25, 2017
Merged

Fix #708 #709

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
12 commits
Select commit Hold shift + click to select a range
16aaf15
sketch of a solution to #708
Rich-Harris Jul 11, 2017
192d6e4
almost all tests passing again
Rich-Harris Jul 11, 2017
2d2c68c
NAILED IT
Rich-Harris Jul 11, 2017
05a27c5
tidy up test
Rich-Harris Jul 11, 2017
3f65b8b
rename postcreate to aftercreate
Rich-Harris Jul 11, 2017
1733966
tidy up
Rich-Harris Jul 11, 2017
3d51c98
make test more stringent
Rich-Harris Jul 11, 2017
d893f8f
Merge branch 'master' into gh-708
Rich-Harris Jul 24, 2017
0a80658
enforce order of operations
Rich-Harris Jul 24, 2017
3f73f25
update tests
Rich-Harris Jul 24, 2017
197c7e7
rename _block to _lock
Rich-Harris Jul 25, 2017
9085c0a
update tests
Rich-Harris Jul 25, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
42 changes: 24 additions & 18 deletions src/generators/dom/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -125,9 +125,6 @@ export default function dom(
@dispatchObservers( this, this._observers.pre, newState, oldState );
${block.hasUpdateMethod && `this._fragment.update( newState, this._state );`}
@dispatchObservers( this, this._observers.post, newState, oldState );
${generator.hasComponents && `@callAll(this._oncreate);`}
${generator.hasComplexBindings && `@callAll(this._bindings);`}
${generator.hasIntroTransitions && `@callAll(this._postcreate);`}
`;

if (hasJs) {
Expand Down Expand Up @@ -207,9 +204,20 @@ export default function dom(
${generator.stylesheet.hasStyles &&
options.css !== false &&
`if ( !document.getElementById( '${generator.stylesheet.id}-style' ) ) @add_css();`}
${generator.hasComponents && `this._oncreate = [];`}
${generator.hasComplexBindings && `this._bindings = [];`}
${generator.hasIntroTransitions && `this._postcreate = [];`}

${templateProperties.oncreate && `var oncreate = @template.oncreate.bind( this );`}

${(templateProperties.oncreate || generator.hasComponents || generator.hasComplexBindings || generator.hasIntroTransitions) && deindent`
if ( !options._root ) {
this._oncreate = [${templateProperties.oncreate && `oncreate`}];
${(generator.hasComponents || generator.hasComplexBindings) && `this._beforecreate = [];`}
${(generator.hasComponents || generator.hasIntroTransitions) && `this._aftercreate = [];`}
} ${templateProperties.oncreate && deindent`
else {
this._root._oncreate.push(oncreate);
}
`}
`}

this._fragment = @create_main_fragment( this._state, this );

Expand All @@ -226,18 +234,16 @@ export default function dom(
`}
this._fragment.${block.hasIntroMethod ? 'intro' : 'mount'}( options.target, null );
}

${generator.hasComponents && `@callAll(this._oncreate);`}
${generator.hasComplexBindings && `@callAll(this._bindings);`}

${templateProperties.oncreate && deindent`
if ( options._root ) {
options._root._oncreate.push( @template.oncreate.bind( this ) );
} else {
@template.oncreate.call( this );
}`}

${generator.hasIntroTransitions && `@callAll(this._postcreate);`}

${(generator.hasComponents || generator.hasComplexBindings || templateProperties.oncreate || generator.hasIntroTransitions) && deindent`
if ( !options._root ) {
${generator.hasComponents && `this._lock = true;`}
${(generator.hasComponents || generator.hasComplexBindings) && `@callAll(this._beforecreate);`}
${(generator.hasComponents || templateProperties.oncreate) && `@callAll(this._oncreate);`}
${(generator.hasComponents || generator.hasIntroTransitions) && `@callAll(this._aftercreate);`}
${generator.hasComponents && `this._lock = false;`}
}
`}
}

@assign( ${prototypeBase}, ${proto});
Expand Down
25 changes: 17 additions & 8 deletions src/generators/dom/visitors/Component/Binding.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -66,15 +66,24 @@ export default function visitBinding(
const updating = block.getUniqueName(`${local.name}_updating`);
block.addVariable(updating, 'false');

const observer = block.getUniqueName('observer');
const value = block.getUniqueName('value');

local.create.addBlock(deindent`
#component._bindings.push( function () {
if ( ${local.name}._torndown ) return;
${local.name}.observe( '${attribute.name}', function ( value ) {
if ( ${updating} ) return;
${updating} = true;
${setter}
${updating} = false;
}, { init: @differs( ${local.name}.get( '${attribute.name}' ), ${snippet} ) });
function ${observer} ( value ) {
if ( ${updating} ) return;
${updating} = true;
${setter}
${updating} = false;
}

${local.name}.observe( '${attribute.name}', ${observer}, { init: false });

#component._root._beforecreate.push( function () {
var value = ${local.name}.get( '${attribute.name}' );
if ( @differs( value, ${snippet} ) ) {
${observer}.call( ${local.name}, value );
}
});
`);

Expand Down
4 changes: 2 additions & 2 deletions src/generators/dom/visitors/Element/Binding.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -94,7 +94,7 @@ export default function visitBinding(

generator.hasComplexBindings = true;
block.builders.hydrate.addBlock(
`if ( !('${name}' in state) ) #component._bindings.push( ${handler} );`
`if ( !('${name}' in state) ) #component._root._beforecreate.push( ${handler} );`
);
} else if (attribute.name === 'group') {
// <input type='checkbox|radio' bind:group='selected'> special case
Expand All @@ -120,7 +120,7 @@ export default function visitBinding(
updateElement = `${state.parentNode}.checked = ${condition};`;
} else if (node.name === 'audio' || node.name === 'video') {
generator.hasComplexBindings = true;
block.builders.hydrate.addBlock(`#component._bindings.push( ${handler} );`);
block.builders.hydrate.addBlock(`#component._root._beforecreate.push( ${handler} );`);

if (attribute.name === 'currentTime') {
const frame = block.getUniqueName(`${state.parentNode}_animationframe`);
Expand Down
4 changes: 2 additions & 2 deletions src/generators/dom/visitors/Element/addTransitions.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ export default function addTransitions(
const fn = `@template.transitions.${intro.name}`;

block.builders.intro.addBlock(deindent`
#component._postcreate.push( function () {
#component._root._aftercreate.push( function () {
if ( !${name} ) ${name} = @wrapTransition( #component, ${state.name}, ${fn}, ${snippet}, true, null );
${name}.run( true, function () {
#component.fire( 'intro.end', { node: ${state.name} });
Expand Down Expand Up @@ -58,7 +58,7 @@ export default function addTransitions(
}

block.builders.intro.addBlock(deindent`
#component._postcreate.push( function () {
#component._root._aftercreate.push( function () {
${introName} = @wrapTransition( #component, ${state.name}, ${fn}, ${snippet}, true, null );
${introName}.run( true, function () {
#component.fire( 'intro.end', { node: ${state.name} });
Expand Down
8 changes: 4 additions & 4 deletions src/generators/dom/visitors/shared/binding/getSetter.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,10 +27,10 @@ export default function getSetter({
list[index]${tail} = ${value};

${computed
? `#component._set({ ${dependencies
? `#component.set({ ${dependencies
.map((prop: string) => `${prop}: state.${prop}`)
.join(', ')} });`
: `#component._set({ ${dependencies
: `#component.set({ ${dependencies
.map((prop: string) => `${prop}: #component.get( '${prop}' )`)
.join(', ')} });`}
`;
Expand All @@ -40,13 +40,13 @@ export default function getSetter({
return deindent`
var state = #component.get();
${snippet} = ${value};
#component._set({ ${dependencies
#component.set({ ${dependencies
.map((prop: string) => `${prop}: state.${prop}`)
.join(', ')} });
`;
}

return `#component._set({ ${name}: ${value} });`;
return `#component.set({ ${name}: ${value} });`;
}

function isComputed(node: Node) {
Expand Down
5 changes: 5 additions & 0 deletions src/shared/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -106,7 +106,12 @@ export function onDev(eventName, handler) {

export function set(newState) {
this._set(assign({}, newState));
if (this._root._lock) return;
this._root._lock = true;
callAll(this._root._beforecreate);
callAll(this._root._oncreate);
callAll(this._root._aftercreate);
this._root._lock = false;
}

export function callAll(fns) {
Expand Down
5 changes: 5 additions & 0 deletions test/js/samples/collapses-text-around-comments/expected-bundle.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -115,7 +115,12 @@ function on(eventName, handler) {

function set(newState) {
this._set(assign({}, newState));
if (this._root._lock) return;
this._root._lock = true;
callAll(this._root._beforecreate);
callAll(this._root._oncreate);
callAll(this._root._aftercreate);
this._root._lock = false;
}

function callAll(fns) {
Expand Down
5 changes: 5 additions & 0 deletions test/js/samples/computed-collapsed-if/expected-bundle.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -91,7 +91,12 @@ function on(eventName, handler) {

function set(newState) {
this._set(assign({}, newState));
if (this._root._lock) return;
this._root._lock = true;
callAll(this._root._beforecreate);
callAll(this._root._oncreate);
callAll(this._root._aftercreate);
this._root._lock = false;
}

function callAll(fns) {
Expand Down
5 changes: 5 additions & 0 deletions test/js/samples/each-block-changed-check/expected-bundle.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -124,7 +124,12 @@ function on(eventName, handler) {

function set(newState) {
this._set(assign({}, newState));
if (this._root._lock) return;
this._root._lock = true;
callAll(this._root._beforecreate);
callAll(this._root._oncreate);
callAll(this._root._aftercreate);
this._root._lock = false;
}

function callAll(fns) {
Expand Down
5 changes: 5 additions & 0 deletions test/js/samples/event-handlers-custom/expected-bundle.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -109,7 +109,12 @@ function on(eventName, handler) {

function set(newState) {
this._set(assign({}, newState));
if (this._root._lock) return;
this._root._lock = true;
callAll(this._root._beforecreate);
callAll(this._root._oncreate);
callAll(this._root._aftercreate);
this._root._lock = false;
}

function callAll(fns) {
Expand Down
5 changes: 5 additions & 0 deletions test/js/samples/if-block-no-update/expected-bundle.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -115,7 +115,12 @@ function on(eventName, handler) {

function set(newState) {
this._set(assign({}, newState));
if (this._root._lock) return;
this._root._lock = true;
callAll(this._root._beforecreate);
callAll(this._root._oncreate);
callAll(this._root._aftercreate);
this._root._lock = false;
}

function callAll(fns) {
Expand Down
5 changes: 5 additions & 0 deletions test/js/samples/if-block-simple/expected-bundle.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -115,7 +115,12 @@ function on(eventName, handler) {

function set(newState) {
this._set(assign({}, newState));
if (this._root._lock) return;
this._root._lock = true;
callAll(this._root._beforecreate);
callAll(this._root._oncreate);
callAll(this._root._aftercreate);
this._root._lock = false;
}

function callAll(fns) {
Expand Down
21 changes: 18 additions & 3 deletions test/js/samples/non-imported-component/expected-bundle.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -103,7 +103,12 @@ function on(eventName, handler) {

function set(newState) {
this._set(assign({}, newState));
if (this._root._lock) return;
this._root._lock = true;
callAll(this._root._beforecreate);
callAll(this._root._oncreate);
callAll(this._root._aftercreate);
this._root._lock = false;
}

function callAll(fns) {
Expand Down Expand Up @@ -178,7 +183,12 @@ function SvelteComponent ( options ) {
this._yield = options._yield;

this._torndown = false;
this._oncreate = [];

if ( !options._root ) {
this._oncreate = [];
this._beforecreate = [];
this._aftercreate = [];
}

this._fragment = create_main_fragment( this._state, this );

Expand All @@ -187,7 +197,13 @@ function SvelteComponent ( options ) {
this._fragment.mount( options.target, null );
}

callAll(this._oncreate);
if ( !options._root ) {
this._lock = true;
callAll(this._beforecreate);
callAll(this._oncreate);
callAll(this._aftercreate);
this._lock = false;
}
}

assign( SvelteComponent.prototype, proto );
Expand All @@ -197,7 +213,6 @@ SvelteComponent.prototype._set = function _set ( newState ) {
this._state = assign( {}, oldState, newState );
dispatchObservers( this, this._observers.pre, newState, oldState );
dispatchObservers( this, this._observers.post, newState, oldState );
callAll(this._oncreate);
};

SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = function destroy ( detach ) {
Expand Down
16 changes: 13 additions & 3 deletions test/js/samples/non-imported-component/expected.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -62,7 +62,12 @@ function SvelteComponent ( options ) {
this._yield = options._yield;

this._torndown = false;
this._oncreate = [];

if ( !options._root ) {
this._oncreate = [];
this._beforecreate = [];
this._aftercreate = [];
}

this._fragment = create_main_fragment( this._state, this );

Expand All @@ -71,7 +76,13 @@ function SvelteComponent ( options ) {
this._fragment.mount( options.target, null );
}

callAll(this._oncreate);
if ( !options._root ) {
this._lock = true;
callAll(this._beforecreate);
callAll(this._oncreate);
callAll(this._aftercreate);
this._lock = false;
}
}

assign( SvelteComponent.prototype, proto );
Expand All @@ -81,7 +92,6 @@ SvelteComponent.prototype._set = function _set ( newState ) {
this._state = assign( {}, oldState, newState );
dispatchObservers( this, this._observers.pre, newState, oldState );
dispatchObservers( this, this._observers.post, newState, oldState );
callAll(this._oncreate);
};

SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = function destroy ( detach ) {
Expand Down
19 changes: 15 additions & 4 deletions test/js/samples/onrender-onteardown-rewritten/expected-bundle.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -91,7 +91,12 @@ function on(eventName, handler) {

function set(newState) {
this._set(assign({}, newState));
if (this._root._lock) return;
this._root._lock = true;
callAll(this._root._beforecreate);
callAll(this._root._oncreate);
callAll(this._root._aftercreate);
this._root._lock = false;
}

function callAll(fns) {
Expand Down Expand Up @@ -143,17 +148,23 @@ function SvelteComponent ( options ) {

this._torndown = false;

var oncreate = template.oncreate.bind( this );

if ( !options._root ) {
this._oncreate = [oncreate];
} else {
this._root._oncreate.push(oncreate);
}

this._fragment = create_main_fragment( this._state, this );

if ( options.target ) {
this._fragment.create();
this._fragment.mount( options.target, null );
}

if ( options._root ) {
options._root._oncreate.push( template.oncreate.bind( this ) );
} else {
template.oncreate.call( this );
if ( !options._root ) {
callAll(this._oncreate);
}
}

Expand Down
Loading