From 2dd2e0c88eaf1d6ba6b09630f0ffd71cbedc301a Mon Sep 17 00:00:00 2001 From: Craig Beck Date: Wed, 10 Jul 2024 14:14:53 -0700 Subject: [PATCH] Use const/let over var --- test/dom/ComponentHarness.mocha.js | 74 +++---- test/dom/as.mocha.js | 30 +-- test/dom/bindings.mocha.js | 152 ++++++------- test/dom/components.mocha.js | 14 +- test/dom/dom-events.mocha.js | 22 +- test/dom/domTestRunner.mocha.js | 1 + test/dom/forms.browser.mocha.js | 15 +- test/dom/templates/templates.dom.mocha.js | 258 +++++++++++----------- 8 files changed, 285 insertions(+), 281 deletions(-) diff --git a/test/dom/ComponentHarness.mocha.js b/test/dom/ComponentHarness.mocha.js index 3273e7bd..eef5ff9d 100644 --- a/test/dom/ComponentHarness.mocha.js +++ b/test/dom/ComponentHarness.mocha.js @@ -1,23 +1,23 @@ -var expect = require('chai').expect; -var Component = require('../../src/components').Component; -var domTestRunner = require('../../src/test-utils/domTestRunner'); +const expect = require('chai').expect; +const Component = require('../../src/components').Component; +const domTestRunner = require('../../src/test-utils/domTestRunner'); describe('ComponentHarness', function() { - var runner = domTestRunner.install(); + const runner = domTestRunner.install(); describe('renderDom', function() { it('returns a page object', function() { function Box() {} Box.view = {is: 'box'}; - var harness = runner.createHarness('', Box); - var page = harness.renderDom(); + const harness = runner.createHarness('', Box); + const page = harness.renderDom(); expect(page).instanceof(harness.app.Page); }); it('sets component property on returned object', function() { function Box() {} Box.view = {is: 'box'}; - var box = runner.createHarness('', Box).renderDom().component; + const box = runner.createHarness('', Box).renderDom().component; expect(box).instanceof(Box); }); @@ -27,7 +27,7 @@ describe('ComponentHarness', function() { is: 'box', source: '
' }; - var fragment = runner.createHarness('', Box).renderDom().fragment; + const fragment = runner.createHarness('', Box).renderDom().fragment; expect(fragment).instanceof(runner.window.DocumentFragment); expect(fragment).html('
'); }); @@ -49,7 +49,7 @@ describe('ComponentHarness', function() { '' + '
' }; - var box = runner.createHarness('', Box, Clown).renderDom().component; + const box = runner.createHarness('', Box, Clown).renderDom().component; expect(box.myClown).instanceof(Clown); }); @@ -61,9 +61,9 @@ describe('ComponentHarness', function() { '' + '
' }; - var page = runner.createHarness('', Box).renderDom(); - var fragment = page.fragment; - var component = page.component; + const page = runner.createHarness('', Box).renderDom(); + const fragment = page.fragment; + const component = page.component; expect(fragment).html('
'); component.model.set('open', true); expect(fragment).html('
'); @@ -77,8 +77,8 @@ describe('ComponentHarness', function() { '' + '
' }; - var component = runner.createHarness('', Box).renderDom().component; - var container = component.container; + const component = runner.createHarness('', Box).renderDom().component; + const container = component.container; expect(container.className).equal('box '); component.model.set('open', true); expect(container.className).equal('box open'); @@ -96,9 +96,9 @@ describe('ComponentHarness', function() { '{{/unless}}' + '' }; - var page = runner.createHarness('', Box) + const page = runner.createHarness('', Box) .stubComponent('clown').renderDom(); - var model = page.component.model; + const model = page.component.model; expect(page.clown).instanceof(Component); model.set('hideClown', true); expect(page.clown).equal(undefined); @@ -121,10 +121,10 @@ describe('ComponentHarness', function() { '{{/if}}' + '' }; - var page = runner.createHarness('', Box) + const page = runner.createHarness('', Box) .stubComponent({is: 'clown', asArray: 'clowns'}).renderDom(); - var clowns = page.clowns; - var model = page.component.model; + const clowns = page.clowns; + const model = page.component.model; expect(clowns.length).equal(1); expect(clowns[0].model.get('expression')).equal('happy'); model.set('showSad', true); @@ -146,7 +146,7 @@ describe('ComponentHarness', function() { is: 'box', source: '
' }; - var harness = runner.createHarness('', Box); + const harness = runner.createHarness('', Box); expect(harness).to.render(); }); @@ -156,7 +156,7 @@ describe('ComponentHarness', function() { is: 'box', source: '

' }; - var harness = runner.createHarness('', Box); + const harness = runner.createHarness('', Box); expect(harness).not.to.render(); }); @@ -166,7 +166,7 @@ describe('ComponentHarness', function() { is: 'box', source: '
' }; - var harness = runner.createHarness('', Box); + const harness = runner.createHarness('', Box); expect(harness).not.to.render(); }); @@ -176,7 +176,7 @@ describe('ComponentHarness', function() { is: 'box', source: '
' }; - var harness = runner.createHarness('', Box); + const harness = runner.createHarness('', Box); expect(harness).to.render('
'); }); @@ -186,14 +186,14 @@ describe('ComponentHarness', function() { is: 'box', source: '

' }; - var harness = runner.createHarness('', Box); + const harness = runner.createHarness('', Box); expect(harness).not.to.render('

'); }); it('passes with blank view', function() { function Box() {} Box.view = {is: 'box'}; - var harness = runner.createHarness('', Box); + const harness = runner.createHarness('', Box); expect(harness).to.render(''); }); @@ -206,12 +206,12 @@ describe('ComponentHarness', function() { Box.prototype.create = function() { this.boxElement.className = 'box-changed-in-create'; }; - var harness = runner.createHarness('', Box); + const harness = runner.createHarness('', Box); expect(harness).to.render('
'); }); it('works with HTML entities like  ', function() { - var harness = runner.createHarness('< ">'); + const harness = runner.createHarness('< ">'); expect(harness).to.render(); expect(harness).to.render('< ">'); }); @@ -223,7 +223,7 @@ describe('ComponentHarness', function() { source: '
{{greeting}}
' }; Box.prototype.init = function() { - var initialName = this.model.scope('_page.initialName').get(); + const initialName = this.model.scope('_page.initialName').get(); expect(initialName).to.equal('Spot'); this.model.set('name', initialName); this.model.start('greeting', ['name'], function(name) { @@ -233,7 +233,7 @@ describe('ComponentHarness', function() { return 'Hello, ' + name; }); }; - var harness = runner.createHarness('', Box); + const harness = runner.createHarness('', Box); // Have the test depend on state in `_page` to make sure it's not cleared // between rendering passes in `.to.render`. harness.model.set('_page.initialName', 'Spot'); @@ -244,15 +244,15 @@ describe('ComponentHarness', function() { describe('fake app.history implementation', function() { it('accepts url option', function() { - var renderUrl = '/box?size=123'; - var expectedQueryParams = {size: '123'}; + const renderUrl = '/box?size=123'; + const expectedQueryParams = {size: '123'}; - var harness = runner.createHarness( + const harness = runner.createHarness( 'url: {{$render.url}} | query: {{JSON.stringify($render.query)}}' ); - var expectedHtml = 'url: /box?size=123 | query: {"size":"123"}'; + const expectedHtml = 'url: /box?size=123 | query: {"size":"123"}'; - var page = harness.renderHtml({url: renderUrl}); + const page = harness.renderHtml({url: renderUrl}); expectPageParams(page, renderUrl, expectedQueryParams); expect(page.html).to.equal(expectedHtml); @@ -262,14 +262,14 @@ describe('ComponentHarness', function() { }); it('supports push(url) and replace(url)', function() { - var harness = runner.createHarness( + const harness = runner.createHarness( 'url: {{$render.url}} | query: {{JSON.stringify($render.query)}}' ); - var page = harness.renderDom(); + const page = harness.renderDom(); expectPageParams(page, '', {}); - var newUrl = '/box?size=123'; + const newUrl = '/box?size=123'; harness.app.history.push(newUrl); expectPageParams(page, newUrl, {size: '123'}); expect(page.fragment).html('url: /box?size=123 | query: {"size":"123"}'); diff --git a/test/dom/as.mocha.js b/test/dom/as.mocha.js index e8229366..9e503be2 100644 --- a/test/dom/as.mocha.js +++ b/test/dom/as.mocha.js @@ -1,8 +1,8 @@ -var expect = require('chai').expect; -var domTestRunner = require('../../src/test-utils/domTestRunner'); +const expect = require('chai').expect; +const domTestRunner = require('../../src/test-utils/domTestRunner'); describe('as', function() { - var runner = domTestRunner.install({ + const runner = domTestRunner.install({ jsdomOptions: { // solution for `SecurityError: localStorage is not available for opaque origins` // Racer interfaces with localStorage and the `as-object` tests use `page.model` @@ -15,8 +15,8 @@ describe('as', function() { it('HTML element `as` property', function() { const { app } = runner.createHarness(); app.views.register('Body', '
'); - var page = app.createPage(); - var fragment = page.getFragment('Body'); + const page = app.createPage(); + const fragment = page.getFragment('Body'); expect(page.nested[0]).html('
'); expect(fragment).html('
'); }); @@ -27,8 +27,8 @@ describe('as', function() { app.views.register('item', '
') function Item() {}; app.component('item', Item); - var page = app.createPage(); - var fragment = page.getFragment('Body'); + const page = app.createPage(); + const fragment = page.getFragment('Body'); expect(page.nested[0]).instanceof(Item); expect(page.nested[0].markerNode.nextSibling).html('
'); expect(fragment).html('
'); @@ -47,13 +47,13 @@ describe('as', function() { '{{/each}}' + '' ); - var page = app.createPage(); + const page = app.createPage(); page.model.set('_page.items', [ {id: 'a', text: 'A'}, {id: 'b', text: 'B'}, {id: 'c', text: 'C'} ]); - var fragment = page.getFragment('Body'); + const fragment = page.getFragment('Body'); expect(page.nested.map).all.keys('a', 'b', 'c'); expect(page.nested.map.a).html('
  • A
    • '); @@ -97,13 +97,13 @@ describe('as', function() { app.views.register('item', '
  • {{@content}}
    • '); function Item() {}; app.component('item', Item); - var page = app.createPage(); + const page = app.createPage(); page.model.set('_page.items', [ {id: 'a', text: 'A'}, {id: 'b', text: 'B'}, {id: 'c', text: 'C'} ]); - var fragment = page.getFragment('Body'); + const fragment = page.getFragment('Body'); expect(page.nested.map).all.keys('a', 'b', 'c'); expect(page.nested.map.a).instanceof(Item); @@ -150,13 +150,13 @@ describe('as', function() { '{{/each}}' + '' ); - var page = app.createPage(); + const page = app.createPage(); page.model.set('_page.items', [ {id: 'a', text: 'A'}, {id: 'b', text: 'B'}, {id: 'c', text: 'C'} ]); - var fragment = page.getFragment('Body'); + const fragment = page.getFragment('Body'); expect(page.nested.list).an('array'); expect(page.nested.list).length(3); @@ -197,13 +197,13 @@ describe('as', function() { app.views.register('item', '
  • {{@content}}
    • '); function Item() {}; app.component('item', Item); - var page = app.createPage(); + const page = app.createPage(); page.model.set('_page.items', [ {id: 'a', text: 'A'}, {id: 'b', text: 'B'}, {id: 'c', text: 'C'} ]); - var fragment = page.getFragment('Body'); + const fragment = page.getFragment('Body'); expect(page.nested.list).an('array'); expect(page.nested.list).length(3); diff --git a/test/dom/bindings.mocha.js b/test/dom/bindings.mocha.js index 66318fef..87f1b75b 100644 --- a/test/dom/bindings.mocha.js +++ b/test/dom/bindings.mocha.js @@ -1,22 +1,22 @@ -var expect = require('chai').expect; -var domTestRunner = require('../../src/test-utils/domTestRunner'); +const expect = require('chai').expect; +const domTestRunner = require('../../src/test-utils/domTestRunner'); describe('bindings', function() { const runner = domTestRunner.install(); describe('bracket dependencies', function() { it('bracket inner dependency change', function() { - var app = runner.createHarness().app; + const app = runner.createHarness().app; app.views.register('Body', '{{_page.doc[_page.key]}}'); - var page = app.createPage(); - var doc = page.model.at('_page.doc'); - var key = page.model.at('_page.key'); + const page = app.createPage(); + const doc = page.model.at('_page.doc'); + const key = page.model.at('_page.key'); doc.set({ one: 'hi', two: 'bye' }); key.set('one'); - var fragment = page.getFragment('Body'); + const fragment = page.getFragment('Body'); expect(fragment).html('hi'); key.set('two'); expect(fragment).html('bye'); @@ -27,17 +27,17 @@ describe('bindings', function() { }); it('bracket outer dependency change', function() { - var app = runner.createHarness().app; + const app = runner.createHarness().app; app.views.register('Body', '{{_page.doc[_page.key]}}'); - var page = app.createPage(); - var doc = page.model.at('_page.doc'); - var key = page.model.at('_page.key'); + const page = app.createPage(); + const doc = page.model.at('_page.doc'); + const key = page.model.at('_page.key'); doc.set({ one: 'hi', two: 'bye' }); key.set('one'); - var fragment = page.getFragment('Body'); + const fragment = page.getFragment('Body'); expect(fragment).html('hi'); doc.set('one', 'hello') expect(fragment).html('hello'); @@ -50,17 +50,17 @@ describe('bindings', function() { }); it('bracket inner then outer dependency change', function() { - var app = runner.createHarness().app; + const app = runner.createHarness().app; app.views.register('Body', '{{_page.doc[_page.key]}}'); - var page = app.createPage(); - var doc = page.model.at('_page.doc'); - var key = page.model.at('_page.key'); + const page = app.createPage(); + const doc = page.model.at('_page.doc'); + const key = page.model.at('_page.key'); doc.set({ one: 'hi', two: 'bye' }); key.set('one'); - var fragment = page.getFragment('Body'); + const fragment = page.getFragment('Body'); expect(fragment).html('hi'); key.set('two'); expect(fragment).html('bye'); @@ -78,16 +78,16 @@ describe('bindings', function() { describe('dynamic view instances', function() { it('simple dynamic view', function() { - var app = runner.createHarness().app; + const app = runner.createHarness().app; app.views.register('Body', '' ); app.views.register('one', 'One'); app.views.register('two', 'Two'); - var page = app.createPage(); - var view = page.model.at('_page.view'); + const page = app.createPage(); + const view = page.model.at('_page.view'); view.set('one'); - var fragment = page.getFragment('Body'); + const fragment = page.getFragment('Body'); expect(fragment).html('One'); view.set('two'); expect(fragment).html('Two'); @@ -97,18 +97,18 @@ describe('bindings', function() { expect(fragment).html('One'); }); it('bracketed dynamic view', function() { - var app = runner.createHarness().app; + const app = runner.createHarness().app; app.views.register('Body', '' ); app.views.register('one', 'One'); app.views.register('two', 'Two'); app.views.register('three', 'Three'); - var page = app.createPage(); + const page = app.createPage(); page.model.set('_page.names', ['one', 'two']); - var index = page.model.at('_page.index'); + const index = page.model.at('_page.index'); index.set(0); - var fragment = page.getFragment('Body'); + const fragment = page.getFragment('Body'); expect(fragment).html('One'); index.set(1); expect(fragment).html('Two'); @@ -122,8 +122,8 @@ describe('bindings', function() { expect(fragment).html('Three'); }); it('only renders if the expression value changes', function() { - var app = runner.createHarness().app; - var count = 0; + const app = runner.createHarness().app; + const count = 0; app.proto.count = function() { return count++; }; @@ -133,10 +133,10 @@ describe('bindings', function() { app.views.register('Body', ''); app.views.register('one', 'One {{count()}}'); app.views.register('two', 'Two {{count()}}'); - var page = app.createPage(); - var view = page.model.at('_page.view'); + const page = app.createPage(); + const view = page.model.at('_page.view'); view.set('one'); - var fragment = page.getFragment('Body'); + const fragment = page.getFragment('Body'); expect(fragment).html('One 0'); view.set('two'); expect(fragment).html('Two 1'); @@ -151,7 +151,7 @@ describe('bindings', function() { describe('basic blocks', function() { it('if', function() { - var app = runner.createHarness().app; + const app = runner.createHarness().app; app.views.register('Body', '{{if _page.nested.value}}' + '{{this}}.' + @@ -159,10 +159,10 @@ describe('bindings', function() { 'otherwise' + '{{/if}}' ); - var page = app.createPage(); - var fragment = page.getFragment('Body'); + const page = app.createPage(); + const fragment = page.getFragment('Body'); expect(fragment).html('otherwise'); - var value = page.model.at('_page.nested.value'); + const value = page.model.at('_page.nested.value'); value.set(true); expect(fragment).html('true.'); value.set(false); @@ -171,7 +171,7 @@ describe('bindings', function() { expect(fragment).html('hello.'); }); it('unless', function() { - var app = runner.createHarness().app; + const app = runner.createHarness().app; app.views.register('Body', '{{unless _page.nested.value}}' + 'nada' + @@ -179,10 +179,10 @@ describe('bindings', function() { 'otherwise' + '{{/unless}}' ); - var page = app.createPage(); - var fragment = page.getFragment('Body'); + const page = app.createPage(); + const fragment = page.getFragment('Body'); expect(fragment).html('nada'); - var value = page.model.at('_page.nested.value'); + const value = page.model.at('_page.nested.value'); value.set(true); expect(fragment).html('otherwise'); value.set(false); @@ -191,7 +191,7 @@ describe('bindings', function() { expect(fragment).html('otherwise'); }); it('each else', function() { - var app = runner.createHarness().app; + const app = runner.createHarness().app; app.views.register('Body', '{{each _page.items}}' + '{{this}}.' + @@ -199,10 +199,10 @@ describe('bindings', function() { 'otherwise' + '{{/each}}' ); - var page = app.createPage(); - var fragment = page.getFragment('Body'); + const page = app.createPage(); + const fragment = page.getFragment('Body'); expect(fragment).html('otherwise'); - var items = page.model.at('_page.items'); + const items = page.model.at('_page.items'); items.set(['one', 'two', 'three']); expect(fragment).html('one.two.three.'); items.set([]); @@ -218,7 +218,7 @@ describe('bindings', function() { describe('nested blocks', function() { it('each containing if', function() { - var app = runner.createHarness().app; + const app = runner.createHarness().app; app.views.register('Body', '{{each _page.items as #item}}' + '{{if _page.toggle}}' + @@ -226,10 +226,10 @@ describe('bindings', function() { '{{/if}}' + '{{/each}}' ); - var page = app.createPage(); - var items = page.model.at('_page.items'); - var toggle = page.model.at('_page.toggle'); - var fragment = page.getFragment('Body'); + const page = app.createPage(); + const items = page.model.at('_page.items'); + const toggle = page.model.at('_page.toggle'); + const fragment = page.getFragment('Body'); items.set(['one', 'two', 'three']); toggle.set(true); items.move(2, 1); @@ -239,7 +239,7 @@ describe('bindings', function() { describe('as properties', function() { it('conditionally rendered', function(done) { - var harness = runner.createHarness(` + const harness = runner.createHarness(` `); function Box() {} @@ -254,12 +254,12 @@ describe('bindings', function() { {{/if}}> ` }; - var app = harness.app; + const app = harness.app; app.component(Box); - var page = harness.renderDom(); - var value = page.component.model.at('_page.foo'); + const page = harness.renderDom(); + const value = page.component.model.at('_page.foo'); value.set(true); - var initialElement = page.box.myDiv; + const initialElement = page.box.myDiv; expect(page.box.myDiv, 'check pre value change') .instanceOf(Object) .to.have.property('textContent', 'one'); @@ -275,7 +275,7 @@ describe('bindings', function() { ['__proto__', 'constructor'].forEach(function(badKey) { it(`disallows prototype modification with ${badKey}`, function() { - var harness = runner.createHarness(` + const harness = runner.createHarness(` `); function Box() {} @@ -286,7 +286,7 @@ describe('bindings', function() {
    one
    ` }; - var app = harness.app; + const app = harness.app; app.component(Box); expect(() => harness.renderDom()).to.throw(`Unsafe key "${badKey}"`); // Rendering to HTML string should still work, as that doesn't process `as` attributes @@ -297,7 +297,7 @@ describe('bindings', function() { function testArray(itemTemplate, itemData) { it('each on path', function() { - var app = runner.createHarness().app; + const app = runner.createHarness().app; app.views.register('Body', '
      ' + '{{each _page.items as #item, #i}}' + itemTemplate + '{{/each}}' + @@ -306,7 +306,7 @@ describe('bindings', function() { testEach(app); }); it('each on alias', function() { - var app = runner.createHarness().app; + const app = runner.createHarness().app; app.views.register('Body', '{{with _page.items as #items}}' + '
        ' + @@ -317,7 +317,7 @@ describe('bindings', function() { testEach(app); }); it('each on relative path', function() { - var app = runner.createHarness().app; + const app = runner.createHarness().app; app.views.register('Body', '{{with _page.items}}' + '
          ' + @@ -328,7 +328,7 @@ describe('bindings', function() { testEach(app); }); it('each on relative subpath', function() { - var app = runner.createHarness().app; + const app = runner.createHarness().app; app.views.register('Body', '{{with _page}}' + '
            ' + @@ -339,7 +339,7 @@ describe('bindings', function() { testEach(app); }); it('each on attribute', function() { - var app = runner.createHarness().app; + const app = runner.createHarness().app; app.views.register('Body', '' ); @@ -351,7 +351,7 @@ describe('bindings', function() { testEach(app); }); it('each containing withs', function() { - var app = runner.createHarness().app; + const app = runner.createHarness().app; app.views.register('Body', '
              ' + '{{each _page.items as #item, #i}}' + @@ -368,7 +368,7 @@ describe('bindings', function() { testEach(app); }); it('each containing view instance', function() { - var app = runner.createHarness().app; + const app = runner.createHarness().app; app.views.register('Body', '
                ' + '{{each _page.items as #item, #i}}' + @@ -380,7 +380,7 @@ describe('bindings', function() { testEach(app); }); it('each containing view instance containing with', function() { - var app = runner.createHarness().app; + const app = runner.createHarness().app; app.views.register('Body', '
                  ' + '{{each _page.items as #item, #i}}' + @@ -392,9 +392,9 @@ describe('bindings', function() { testEach(app); }); function testEach(app) { - var page = app.createPage(); - var items = page.model.at('_page.items'); - var fragment = page.getFragment('Body'); + const page = app.createPage(); + const items = page.model.at('_page.items'); + const fragment = page.getFragment('Body'); expect(fragment).html('
                    '); items.insert(0, itemData.slice(0, 2)); expect(fragment).html( @@ -448,7 +448,7 @@ describe('bindings', function() { }); it('array item binding with view function calls', function() { - var app = runner.createHarness().app; + const app = runner.createHarness().app; app.views.register('Body', ''); function Box() {} Box.view = { @@ -471,8 +471,8 @@ describe('bindings', function() { } return str.length; }; - var page = app.createPage(); - var $items = page.model.at('_page.list.items'); + const page = app.createPage(); + const $items = page.model.at('_page.list.items'); $items.set(['alpha', 'beta']); // if getFragment called before second set() call, bindings are evaluated // multiple times, leading to suggested bug below of len() called w undefined @@ -502,7 +502,7 @@ describe('bindings', function() { // This is solved by having Derby register its catch-all listeners using // the *Immediate events, which operate outside the mutator event queue. it('array chained insertions at index 0', function() { - var app = runner.createHarness().app; + const app = runner.createHarness().app; app.views.register('Body', '
                      ' + '{{each _data.items as #item}}' + @@ -511,16 +511,16 @@ describe('bindings', function() { '
                    ' ); - var page = app.createPage(); + const page = app.createPage(); page.model.on('insert', '_data.items', function(index, values) { if (values[0] === 'B') { page.model.insert('_data.items', 0, 'C'); } }); - var $items = page.model.at('_data.items'); + const $items = page.model.at('_data.items'); $items.set(['A']); - var fragment = page.getFragment('Body'); + const fragment = page.getFragment('Body'); expect(fragment).html('
                    • A
                    '); $items.insert(0, 'B'); expect(fragment).html('
                    • C
                    • B
                    • A
                    '); @@ -531,7 +531,7 @@ describe('bindings', function() { // which handle binding updates. The event model expects that any numeric // path segments it receives have been cast into JS numbers, which the // Racer model doesn't necessarily guarantee. - var app = runner.createHarness().app; + const app = runner.createHarness().app; app.views.register('Body', '
                      ' + '{{each _data.items as #item}}' + @@ -539,15 +539,15 @@ describe('bindings', function() { '{{/each}}' + '
                    ' ); - var page = app.createPage(); - var $items = page.model.at('_data.items'); + const page = app.createPage(); + const $items = page.model.at('_data.items'); $items.set([ {label: 'Red', hexCode: '#ff0000'}, {label: 'Green', hexCode: '#00ff00'}, {label: 'Blue', hexCode: '#0000ff'}, ]); - var fragment = page.getFragment('Body'); + const fragment = page.getFragment('Body'); expect(fragment).html('
                    • Red
                    • Green
                    • Blue
                    '); // Test mutation with a numeric path segment. page.model.set('_data.items.1.label', 'Verde'); diff --git a/test/dom/components.mocha.js b/test/dom/components.mocha.js index 1d9adcca..0d674322 100644 --- a/test/dom/components.mocha.js +++ b/test/dom/components.mocha.js @@ -1,16 +1,16 @@ -var expect = require('chai').expect; -var pathLib = require('node:path'); +const expect = require('chai').expect; +const pathLib = require('node:path'); const { Component } = require('../../src/components'); -var domTestRunner = require('../../src/test-utils/domTestRunner'); +const domTestRunner = require('../../src/test-utils/domTestRunner'); describe('components', function() { - var runner = domTestRunner.install(); + const runner = domTestRunner.install(); describe('app.component registration', function() { describe('passing just component class', function() { describe('with static view prop', function() { it('external view file', function() { - var harness = runner.createHarness(); + const harness = runner.createHarness(); function SimpleBox() {} SimpleBox.view = { @@ -25,7 +25,7 @@ describe('components', function() { }); it('inlined view.source', function() { - var harness = runner.createHarness(); + const harness = runner.createHarness(); function SimpleBox() {} SimpleBox.view = { @@ -39,7 +39,7 @@ describe('components', function() { }); it('inferred view file from view name', function() { - var harness = runner.createHarness(); + const harness = runner.createHarness(); // Pre-load view with same name as the component's static `view.is` harness.app.loadViews(pathLib.resolve(__dirname, '../fixtures/simple-box'), 'simple-box'); diff --git a/test/dom/dom-events.mocha.js b/test/dom/dom-events.mocha.js index d3a56631..72e5b64b 100644 --- a/test/dom/dom-events.mocha.js +++ b/test/dom/dom-events.mocha.js @@ -1,5 +1,5 @@ -var expect = require('chai').expect; -var domTestRunner = require('../../src/test-utils/domTestRunner'); +const expect = require('chai').expect; +const domTestRunner = require('../../src/test-utils/domTestRunner'); describe('DOM events', function() { const runner = domTestRunner.install(); @@ -11,15 +11,15 @@ describe('DOM events', function() { '' + '' ); - var page = app.createPage(); - var div, span; + const page = app.createPage(); + let div, span; page.createDiv = function(element) { div = element; }; page.createSpan = function(element) { span = element; }; - var fragment = page.getFragment('Body'); + const fragment = page.getFragment('Body'); expect(fragment).html('
                    '); expect(div).html('
                    '); expect(span).html(''); @@ -34,12 +34,12 @@ describe('DOM events', function() { '{{/unless}}' + '' ); - var page = app.createPage(); - var span; + const page = app.createPage(); + let span; page.destroySpan = function(element) { span = element; }; - var fragment = page.getFragment('Body'); + const fragment = page.getFragment('Body'); expect(fragment).html('
                    '); expect(span).equal(undefined); @@ -57,9 +57,9 @@ describe('DOM events', function() { '{{/unless}}' + '' ); - var page = app.createPage(); - var fragment = page.getFragment('Body'); - var destroyed = false; + const page = app.createPage(); + const fragment = page.getFragment('Body'); + const destroyed = false; page.dom.on('destroy', page.span, function() { destroyed = true; }); diff --git a/test/dom/domTestRunner.mocha.js b/test/dom/domTestRunner.mocha.js index 22e581a9..f8812d74 100644 --- a/test/dom/domTestRunner.mocha.js +++ b/test/dom/domTestRunner.mocha.js @@ -3,6 +3,7 @@ var domTestRunner = require('../../src/test-utils/domTestRunner'); describe('domTestRunner', function() { describe('with JSDOM option pretendToBeVisual', function() { domTestRunner.install({jsdomOptions: {pretendToBeVisual: true}}); + it('has window.requestAnimationFrame', function(done) { window.requestAnimationFrame(function() { done(); diff --git a/test/dom/forms.browser.mocha.js b/test/dom/forms.browser.mocha.js index 99724341..10f980de 100644 --- a/test/dom/forms.browser.mocha.js +++ b/test/dom/forms.browser.mocha.js @@ -9,13 +9,15 @@ describe('forms', function() { } describe('textarea', function() { + let fixture; beforeEach(function() { - this.fixture = document.createElement('ins'); - document.body.appendChild(this.fixture); + fixture = document.createElement('ins'); + document.body.appendChild(fixture); }); + afterEach(function() { - document.body.removeChild(this.fixture); + document.body.removeChild(fixture); }); it('renders text content in textarea', function() { @@ -58,7 +60,7 @@ describe('forms', function() { var textarea = fragment.firstChild; var textNode = textarea.firstChild; // Insert the fragment in the document so that Derby captures events - this.fixture.appendChild(fragment); + fixture.appendChild(fragment); textNode.data = 'Yo'; textarea.dispatchEvent(createEvent('change')); expect(textarea.value).equal('Yo'); @@ -74,7 +76,7 @@ describe('forms', function() { var fragment = page.getFragment('Body'); var textarea = fragment.firstChild; // Insert the fragment in the document so that Derby captures events - this.fixture.appendChild(fragment); + fixture.appendChild(fragment); textarea.value = 'Yo'; textarea.dispatchEvent(createEvent('change')); expect(text.get()).equal('Yo'); @@ -89,11 +91,10 @@ describe('forms', function() { var fragment = page.getFragment('Body'); var textarea = fragment.firstChild; // Insert the fragment in the document so that Derby captures events - this.fixture.appendChild(fragment); + fixture.appendChild(fragment); textarea.value = 'Yo'; textarea.dispatchEvent(createEvent('input')); expect(text.get()).equal('Yo'); }); - }); }); diff --git a/test/dom/templates/templates.dom.mocha.js b/test/dom/templates/templates.dom.mocha.js index c1e467c6..20a7aa95 100644 --- a/test/dom/templates/templates.dom.mocha.js +++ b/test/dom/templates/templates.dom.mocha.js @@ -1,7 +1,7 @@ -var chai = require('chai'); -var expect = chai.expect; -var saddle = require('../../../src/templates/templates'); -var domTestRunner = require('../../../src/test-utils/domTestRunner'); +const chai = require('chai'); +const expect = chai.expect; +const saddle = require('../../../src/templates/templates'); +const domTestRunner = require('../../../src/test-utils/domTestRunner'); describe('templates rendering', function() { domTestRunner.install({jsdomOptions: {pretendToBeVisual: true}}); @@ -9,17 +9,17 @@ describe('templates rendering', function() { describe('Static rendering', function() { describe('HTML', function() { testStaticRendering(function test(options) { - var context = getContext(); - var html = options.template.get(context); + const context = getContext(); + const html = options.template.get(context); expect(html).equal(options.html); }); }); describe('Fragment', function() { testStaticRendering(function test(options) { - var context = getContext(); + const context = getContext(); // getFragment calls appendTo, so these Fragment tests cover appendTo. - var fragment = options.template.getFragment(context); + const fragment = options.template.getFragment(context); options.fragment(fragment); }); }); @@ -30,20 +30,20 @@ describe('templates rendering', function() { describe('HTML', function() { testDynamicRendering(function test(options) { - var context = getContext({ + const context = getContext({ show: true }); - var html = options.template.get(context); + const html = options.template.get(context); expect(html).equal(options.html); }); }); describe('Fragment', function() { testDynamicRendering(function test(options) { - var context = getContext({ + const context = getContext({ show: true }); - var fragment = options.template.getFragment(context); + const fragment = options.template.getFragment(context); options.fragment(fragment); }); }); @@ -174,10 +174,10 @@ function testStaticRendering(test) { html: '
                    ', fragment: function(fragment) { expect(fragment.childNodes.length).equal(1); - var node = fragment.childNodes[0]; + let node = fragment.childNodes[0]; expect(node.tagName.toLowerCase()).equal('div'); expect(node.childNodes.length).equal(1); - var node = node.childNodes[0]; + node = node.childNodes[0]; expect(node.tagName.toLowerCase()).equal('div'); expect(node.childNodes.length).equal(2); expect(node.childNodes[0].tagName.toLowerCase()).equal('span'); @@ -209,7 +209,7 @@ function testStaticRendering(test) { html: '
                    Hello, world.
                    ', fragment: function(fragment) { expect(fragment.childNodes.length).equal(1); - var node = fragment.childNodes[0]; + const node = fragment.childNodes[0]; expect(node.tagName.toLowerCase()).equal('div'); expect(node.childNodes.length).equal(2); expect(node.childNodes[0].nodeType).equal(3); @@ -245,7 +245,7 @@ function testStaticRendering(test) { expect(fragment.childNodes.length).equal(2); expect(fragment.childNodes[0].nodeType).equal(8); expect(fragment.childNodes[0].data).equal('Hi'); - var node = fragment.childNodes[1]; + const node = fragment.childNodes[1]; expect(node.tagName.toLowerCase()).equal('div'); expect(node.childNodes.length).equal(1); expect(node.childNodes[0].nodeType).equal(3); @@ -260,10 +260,10 @@ function testStaticRendering(test) { html: '
                    Hi
                    ', fragment: function(fragment) { expect(fragment.childNodes.length).equal(2); - var node = fragment.childNodes[0]; + let node = fragment.childNodes[0]; expect(node.tagName.toLowerCase()).equal('div'); expect(node.innerHTML).equal('Hi'); - var node = fragment.childNodes[1]; + node = fragment.childNodes[1]; expect(node.tagName.toLowerCase()).equal('input'); } }); @@ -278,7 +278,7 @@ function testStaticRendering(test) { ]), html: '
                    Hi
                    ', fragment: function(fragment) { - var node = fragment.firstChild; + const node = fragment.firstChild; expect(node.tagName.toLowerCase()).equal('table'); node = node.firstChild; expect(node.tagName.toLowerCase()).equal('tbody'); @@ -373,7 +373,7 @@ function testDynamicRendering(test) { describe('templates DOM manipulation', function() { domTestRunner.install({jsdomOptions: {pretendToBeVisual: true}}); - var fixture; + let fixture; beforeEach(function() { fixture = document.getElementById('fixture'); if (!fixture) { @@ -388,14 +388,14 @@ describe('templates DOM manipulation', function() { describe('attachTo', function() { function renderAndAttach(template) { - var context = getContext(); + const context = getContext(); removeChildren(fixture); fixture.innerHTML = template.get(context); template.attachTo(fixture, fixture.firstChild, context); } it('splits static text nodes', function() { - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.Text('Hi'), new saddle.Text(' there.') ]); @@ -404,7 +404,7 @@ describe('templates DOM manipulation', function() { }); it('splits empty static text nodes', function() { - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.Text(''), new saddle.Text('') ]); @@ -413,7 +413,7 @@ describe('templates DOM manipulation', function() { }); it('splits mixed empty static text nodes', function() { - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.Text(''), new saddle.Text('Hi'), new saddle.Text(''), @@ -426,7 +426,7 @@ describe('templates DOM manipulation', function() { }); it('adds empty text nodes around a comment', function() { - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.Text('Hi'), new saddle.Text(''), new saddle.Comment('cool'), @@ -438,7 +438,7 @@ describe('templates DOM manipulation', function() { }); it('attaches to nested elements', function() { - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.Element('ul', null, [ new saddle.Element('li', null, [ new saddle.Text('One') @@ -452,7 +452,7 @@ describe('templates DOM manipulation', function() { }); it('attaches to element attributes', function() { - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.Element('input', { type: new saddle.Attribute('text'), autofocus: new saddle.Attribute(true), @@ -463,7 +463,7 @@ describe('templates DOM manipulation', function() { }); it('attaches to from HTML within tbody context', function() { - var template = new saddle.Element('table', null, [ + const template = new saddle.Element('table', null, [ new saddle.Element('tbody', null, [ new saddle.Comment('OK'), new saddle.Html('Hi'), @@ -479,7 +479,7 @@ describe('templates DOM manipulation', function() { it('traverses with comments in a table and select', function() { // IE fails to create comments in certain locations when parsing HTML - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.Element('table', null, [ new saddle.Comment('table comment'), new saddle.Element('tbody', null, [ @@ -504,7 +504,7 @@ describe('templates DOM manipulation', function() { it('throws when fragment does not match HTML', function() { // This template is invalid HTML, and when it is parsed it will produce // a different tree structure than when the nodes are created one-by-one - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.Element('table', null, [ new saddle.Element('div', null, [ new saddle.Element('td', null, [ @@ -523,9 +523,9 @@ describe('templates DOM manipulation', function() { describe('binding updates', function() { describe('getFragment', function() { testBindingUpdates(function render(template, data) { - var bindings = []; - var context = getContext(data, bindings); - var fragment = template.getFragment(context); + const bindings = []; + const context = getContext(data, bindings); + const fragment = template.getFragment(context); removeChildren(fixture); fixture.appendChild(fragment); return bindings; @@ -534,8 +534,8 @@ describe('templates DOM manipulation', function() { describe('get + attachTo', function() { testBindingUpdates(function render(template, data) { - var bindings = []; - var context = getContext(data, bindings); + const bindings = []; + const context = getContext(data, bindings); removeChildren(fixture); fixture.innerHTML = template.get(context); template.attachTo(fixture, fixture.firstChild, context); @@ -545,10 +545,10 @@ describe('templates DOM manipulation', function() { function testBindingUpdates(render) { it('updates a single TextNode', function() { - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.DynamicText(new FakeExpression('text')) ]); - var binding = render(template).pop(); + const binding = render(template).pop(); expect(getText(fixture)).equal(''); binding.context = getContext({text: 'Yo'}); binding.update(); @@ -556,14 +556,14 @@ describe('templates DOM manipulation', function() { }); it('updates sibling TextNodes', function() { - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.DynamicText(new FakeExpression('first')), new saddle.DynamicText(new FakeExpression('second')) ]); - var bindings = render(template, {second: 2}); + const bindings = render(template, {second: 2}); expect(bindings.length).equal(2); expect(getText(fixture)).equal('2'); - var context = getContext({first: 'one', second: 'two'}); + const context = getContext({first: 'one', second: 'two'}); bindings[0].context = context; bindings[0].update(); expect(getText(fixture)).equal('one2'); @@ -573,11 +573,11 @@ describe('templates DOM manipulation', function() { }); it('updates a TextNode that returns text, then a Template', function() { - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.DynamicText(new FakeExpression('dynamicTemplate')) ]); - var data = {dynamicTemplate: 'Hola'}; - var binding = render(template, data).pop(); + const data = {dynamicTemplate: 'Hola'}; + const binding = render(template, data).pop(); expect(getText(fixture)).equal('Hola'); binding.context = getContext({ dynamicTemplate: new saddle.DynamicText(new FakeExpression('text')), @@ -588,14 +588,14 @@ describe('templates DOM manipulation', function() { }); it('updates a TextNode that returns a Template, then text', function() { - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.DynamicText(new FakeExpression('dynamicTemplate')) ]); - var data = { + const data = { dynamicTemplate: new saddle.DynamicText(new FakeExpression('text')), text: 'Yo' }; - var binding = render(template, data).pop(); + const binding = render(template, data).pop(); expect(getText(fixture)).equal('Yo'); binding.context = getContext({dynamicTemplate: 'Hola'}); binding.update(); @@ -603,14 +603,14 @@ describe('templates DOM manipulation', function() { }); it('updates a TextNode that returns a Template, then another Template', function() { - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.DynamicText(new FakeExpression('dynamicTemplate')) ]); - var data = { + const data = { dynamicTemplate: new saddle.DynamicText(new FakeExpression('text')), text: 'Yo' }; - var binding = render(template, data).pop(); + const binding = render(template, data).pop(); expect(getText(fixture)).equal('Yo'); binding.context = getContext({ dynamicTemplate: new saddle.Template([ @@ -625,14 +625,14 @@ describe('templates DOM manipulation', function() { }); it('updates within a template returned by a TextNode', function() { - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.DynamicText(new FakeExpression('dynamicTemplate')) ]); - var data = { + const data = { dynamicTemplate: new saddle.DynamicText(new FakeExpression('text')), text: 'Yo' }; - var textBinding = render(template, data).shift(); + const textBinding = render(template, data).shift(); expect(getText(fixture)).equal('Yo'); data.text = 'Hola'; textBinding.context = getContext(data); @@ -641,10 +641,10 @@ describe('templates DOM manipulation', function() { }); it('updates a CommentNode', function() { - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.DynamicComment(new FakeExpression('comment')) ]); - var binding = render(template, {comment: 'Hi'}).pop(); + const binding = render(template, {comment: 'Hi'}).pop(); expect(fixture.innerHTML).equal(''); binding.context = getContext({comment: 'Bye'}); binding.update(); @@ -652,40 +652,41 @@ describe('templates DOM manipulation', function() { }); it('updates raw HTML', function() { - var template = new saddle.Template([ + let children; + const template = new saddle.Template([ new saddle.DynamicHtml(new FakeExpression('html')), new saddle.Element('div') ]); - var binding = render(template, {html: 'Hi'}).pop(); - var children = getChildren(fixture); + const binding = render(template, {html: 'Hi'}).pop(); + children = getChildren(fixture); expect(children.length).equal(2); expect(children[0].tagName.toLowerCase()).equal('b'); expect(children[0].innerHTML).equal('Hi'); expect(children[1].tagName.toLowerCase()).equal('div'); binding.context = getContext({html: 'What?'}); binding.update(); - var children = getChildren(fixture); + children = getChildren(fixture); expect(children.length).equal(2); expect(children[0].tagName.toLowerCase()).equal('i'); expect(children[0].innerHTML).equal('What?'); expect(children[1].tagName.toLowerCase()).equal('div'); binding.context = getContext({html: 'Hola'}); binding.update(); - var children = getChildren(fixture); + children = getChildren(fixture); expect(children.length).equal(1); expect(getText(fixture)).equal('Hola'); expect(children[0].tagName.toLowerCase()).equal('div'); }); it('updates an Element attribute', function() { - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.Element('div', { 'class': new saddle.Attribute('message'), 'data-greeting': new saddle.DynamicAttribute(new FakeExpression('greeting')) }) ]); - var binding = render(template).pop(); - var node = fixture.firstChild; + const binding = render(template).pop(); + const node = fixture.firstChild; expect(node.className).equal('message'); expect(node.getAttribute('data-greeting')).eql(null); // Set initial value @@ -705,14 +706,14 @@ describe('templates DOM manipulation', function() { }); it('updates text input "value" property', function() { - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.Element('input', { 'value': new saddle.DynamicAttribute(new FakeExpression('text')), }) ]); - var binding = render(template).pop(); - var input = fixture.firstChild; + const binding = render(template).pop(); + const input = fixture.firstChild; // Set initial value to string. binding.context = getContext({text: 'Hi'}); @@ -731,15 +732,15 @@ describe('templates DOM manipulation', function() { }); it('does not clobber input type="number" value when typing "1.0"', function() { - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.Element('input', { 'type': new saddle.Attribute('number'), 'value': new saddle.DynamicAttribute(new FakeExpression('amount')), }) ]); - var binding = render(template).pop(); - var input = fixture.firstChild; + const binding = render(template).pop(); + const input = fixture.firstChild; // Make sure that a user-typed input value of "1.0" does not get clobbered by // a context value of `1`. @@ -750,14 +751,14 @@ describe('templates DOM manipulation', function() { }); it('updates "title" attribute', function() { - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.Element('div', { 'title': new saddle.DynamicAttribute(new FakeExpression('divTooltip')), }) ]); - var binding = render(template).pop(); - var node = fixture.firstChild; + const binding = render(template).pop(); + const node = fixture.firstChild; // Set initial value to string. binding.context = getContext({divTooltip: 'My tooltip'}); @@ -776,7 +777,7 @@ describe('templates DOM manipulation', function() { }); it('updates a Block', function() { - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.Block(new FakeExpression('author'), [ new saddle.Element('h3', null, [ new saddle.DynamicText(new FakeExpression('name')) @@ -784,8 +785,9 @@ describe('templates DOM manipulation', function() { new saddle.DynamicText(new FakeExpression('name')) ]) ]); - var binding = render(template).pop(); - var children = getChildren(fixture); + let children; + const binding = render(template).pop(); + children = getChildren(fixture); expect(children.length).equal(1); expect(children[0].tagName.toLowerCase()).equal('h3'); expect(getText(children[0])).equal(''); @@ -793,7 +795,7 @@ describe('templates DOM manipulation', function() { // Update entire block context binding.context = getContext({author: {name: 'John'}}); binding.update(); - var children = getChildren(fixture); + children = getChildren(fixture); expect(children.length).equal(1); expect(children[0].tagName.toLowerCase()).equal('h3'); expect(getText(children[0])).equal('John'); @@ -801,7 +803,7 @@ describe('templates DOM manipulation', function() { // Reset to no data binding.context = getContext(); binding.update(); - var children = getChildren(fixture); + children = getChildren(fixture); expect(children.length).equal(1); expect(children[0].tagName.toLowerCase()).equal('h3'); expect(getText(children[0])).equal(''); @@ -809,14 +811,14 @@ describe('templates DOM manipulation', function() { }); it('updates a single condition ConditionalBlock', function() { - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.ConditionalBlock([ new FakeExpression('show') ], [ [new saddle.Text('shown')] ]) ]); - var binding = render(template).pop(); + const binding = render(template).pop(); expect(getText(fixture)).equal(''); // Update value binding.context = getContext({show: true}); @@ -829,7 +831,7 @@ describe('templates DOM manipulation', function() { }); it('updates a multi-condition ConditionalBlock', function() { - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.ConditionalBlock([ new FakeExpression('primary'), new FakeExpression('alternate'), @@ -840,7 +842,7 @@ describe('templates DOM manipulation', function() { [new saddle.Text('else')] ]) ]); - var binding = render(template).pop(); + const binding = render(template).pop(); expect(getText(fixture)).equal('else'); // Update value binding.context = getContext({primary: 'Heyo'}); @@ -857,12 +859,12 @@ describe('templates DOM manipulation', function() { }); it('updates an each of text', function() { - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.EachBlock(new FakeExpression('items'), [ new saddle.DynamicText(new FakeExpression()) ]) ]); - var binding = render(template).pop(); + const binding = render(template).pop(); expect(getText(fixture)).equal(''); // Update value binding.context = getContext({items: ['One', 'Two', 'Three']}); @@ -883,14 +885,14 @@ describe('templates DOM manipulation', function() { }); it('updates an each with an else', function() { - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.EachBlock(new FakeExpression('items'), [ new saddle.DynamicText(new FakeExpression('name')) ], [ new saddle.Text('else') ]) ]); - var binding = render(template).pop(); + const binding = render(template).pop(); expect(getText(fixture)).equal('else'); // Update value binding.context = getContext({items: [ @@ -915,15 +917,15 @@ describe('templates DOM manipulation', function() { }); it('inserts in an each', function() { - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.EachBlock(new FakeExpression('items'), [ new saddle.DynamicText(new FakeExpression('name')) ]) ]); - var binding = render(template).pop(); + const binding = render(template).pop(); expect(getText(fixture)).equal(''); // Insert from null state - var data = {items: []}; + const data = {items: []}; binding.context = getContext(data); insert(binding, data.items, 0, [{name: 'One'}, {name: 'Two'}, {name: 'Three'}]); expect(getText(fixture)).equal('OneTwoThree'); @@ -933,34 +935,34 @@ describe('templates DOM manipulation', function() { }); it('inserts into empty each with else', function() { - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.EachBlock(new FakeExpression('items'), [ new saddle.DynamicText(new FakeExpression('name')) ], [ new saddle.Text('else') ]) ]); - var binding = render(template).pop(); + const binding = render(template).pop(); expect(getText(fixture)).equal('else'); // Insert from null state - var data = {items: []}; + const data = {items: []}; binding.context = getContext(data); insert(binding, data.items, 0, [{name: 'One'}, {name: 'Two'}, {name: 'Three'}]); expect(getText(fixture)).equal('OneTwoThree'); }); it('removes all items in an each with else', function() { - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.EachBlock(new FakeExpression('items'), [ new saddle.DynamicText(new FakeExpression('name')) ], [ new saddle.Text('else') ]) ]); - var data = {items: [ + const data = {items: [ {name: 'One'}, {name: 'Two'}, {name: 'Three'} ]}; - var binding = render(template, data).pop(); + const binding = render(template, data).pop(); expect(getText(fixture)).equal('OneTwoThree'); binding.context = getContext(data); // Remove all items @@ -969,15 +971,15 @@ describe('templates DOM manipulation', function() { }); it('removes in an each', function() { - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.EachBlock(new FakeExpression('items'), [ new saddle.DynamicText(new FakeExpression('name')) ]) ]); - var data = {items: [ + const data = {items: [ {name: 'One'}, {name: 'Two'}, {name: 'Three'} ]}; - var binding = render(template, data).pop(); + const binding = render(template, data).pop(); expect(getText(fixture)).equal('OneTwoThree'); binding.context = getContext(data); // Remove inner item @@ -989,15 +991,15 @@ describe('templates DOM manipulation', function() { }); it('moves in an each', function() { - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.EachBlock(new FakeExpression('items'), [ new saddle.DynamicText(new FakeExpression('name')) ]) ]); - var data = {items: [ + const data = {items: [ {name: 'One'}, {name: 'Two'}, {name: 'Three'} ]}; - var binding = render(template, data).pop(); + const binding = render(template, data).pop(); expect(getText(fixture)).equal('OneTwoThree'); binding.context = getContext(data); // Move one item @@ -1009,7 +1011,7 @@ describe('templates DOM manipulation', function() { }); it('insert, move, and remove with multiple node items', function() { - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.EachBlock(new FakeExpression('items'), [ new saddle.Element('h3', null, [ new saddle.DynamicText(new FakeExpression('title')) @@ -1017,12 +1019,12 @@ describe('templates DOM manipulation', function() { new saddle.DynamicText(new FakeExpression('text')) ]) ]); - var data = {items: [ + const data = {items: [ {title: '1', text: 'one'}, {title: '2', text: 'two'}, {title: '3', text: 'three'} ]}; - var binding = render(template, data).pop(); + const binding = render(template, data).pop(); expect(getText(fixture)).equal('1one2two3three'); binding.context = getContext(data); // Insert an item @@ -1037,7 +1039,7 @@ describe('templates DOM manipulation', function() { }); it('inserts to outer nested each', function() { - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.EachBlock(new FakeExpression('items'), [ new saddle.DynamicText(new FakeExpression('name')), new saddle.EachBlock(new FakeExpression('subitems'), [ @@ -1045,10 +1047,10 @@ describe('templates DOM manipulation', function() { ]) ]) ]); - var binding = render(template).pop(); + const binding = render(template).pop(); expect(getText(fixture)).equal(''); // Insert from null state - var data = {items: []}; + const data = {items: []}; binding.context = getContext(data); insert(binding, data.items, 0, [ {name: 'One', subitems: [1, 2, 3]}, @@ -1070,7 +1072,7 @@ describe('templates DOM manipulation', function() { }); it('removes from outer nested each', function() { - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.EachBlock(new FakeExpression('items'), [ new saddle.DynamicText(new FakeExpression('name')), new saddle.EachBlock(new FakeExpression('subitems'), [ @@ -1078,12 +1080,12 @@ describe('templates DOM manipulation', function() { ]) ]) ]); - var data = {items: [ + const data = {items: [ {name: 'One', subitems: [1, 2, 3]}, {name: 'Two', subitems: [2, 4, 6]}, {name: 'Three', subitems: [3, 6, 9]} ]}; - var binding = render(template, data).pop(); + const binding = render(template, data).pop(); expect(getText(fixture)).equal('One123Two246Three369'); binding.context = getContext(data); // Remove inner item @@ -1095,7 +1097,7 @@ describe('templates DOM manipulation', function() { }); it('moves to outer nested each', function() { - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.EachBlock(new FakeExpression('items'), [ new saddle.DynamicText(new FakeExpression('name')), new saddle.EachBlock(new FakeExpression('subitems'), [ @@ -1103,12 +1105,12 @@ describe('templates DOM manipulation', function() { ]) ]) ]); - var data = {items: [ + const data = {items: [ {name: 'One', subitems: [1, 2, 3]}, {name: 'Two', subitems: [2, 4, 6]}, {name: 'Three', subitems: [3, 6, 9]} ]}; - var binding = render(template, data).pop(); + const binding = render(template, data).pop(); expect(getText(fixture)).equal('One123Two246Three369'); binding.context = getContext(data); // Move one item @@ -1120,7 +1122,7 @@ describe('templates DOM manipulation', function() { }); it('updates an if inside an each', function() { - var template = new saddle.Template([ + const template = new saddle.Template([ new saddle.EachBlock(new FakeExpression('items'), [ new saddle.ConditionalBlock([ new FakeExpression('flag'), @@ -1131,13 +1133,13 @@ describe('templates DOM manipulation', function() { ]) ]) ]); - var data = {items: [0, 1], flag: true}; - var bindings = render(template, data); + const data = {items: [0, 1], flag: true}; + const bindings = render(template, data); expect(getText(fixture)).equal('AA'); - var eachBinding = bindings[4]; - var if1Binding = bindings[2]; - var if2Binding = bindings[0]; + const eachBinding = bindings[4]; + const if1Binding = bindings[2]; + const if2Binding = bindings[0]; data.flag = false; if1Binding.update(); @@ -1152,7 +1154,7 @@ describe('templates DOM manipulation', function() { }); function getContext(data, bindings) { - var contextMeta = new FakeContextMeta(); + const contextMeta = new FakeContextMeta(); contextMeta.addBinding = function(binding) { if (bindings) { bindings.push(binding); @@ -1169,10 +1171,10 @@ function removeChildren(node) { // IE <=8 return comments for Node.children function getChildren(node) { - var nodeChildren = node.children; - var children = []; - for (var i = 0, len = nodeChildren.length; i < len; i++) { - var child = nodeChildren[i]; + const nodeChildren = node.children; + const children = []; + for (const i = 0, len = nodeChildren.length; i < len; i++) { + const child = nodeChildren[i]; if (child.nodeType === 1) children.push(child); } return children; @@ -1197,7 +1199,7 @@ function remove(binding, array, index, howMany) { binding.remove(index, howMany); } function move(binding, array, from, to, howMany) { - var values = array.splice(from, howMany); + const values = array.splice(from, howMany); array.splice.apply(array, [to, 0].concat(values)); binding.move(from, to, howMany); } @@ -1251,11 +1253,11 @@ FakeContext.prototype.removeNode = function(node) { this.meta.removeNode(node); }; FakeContext.prototype.child = function(expression) { - var data = expression.get(this); + const data = expression.get(this); return new FakeContext(this.meta, data, this); }; FakeContext.prototype.eachChild = function(expression, index) { - var data = expression.get(this)[index]; + const data = expression.get(this)[index]; return new FakeContext(this.meta, data, this); }; FakeContext.prototype._get = function(property) { @@ -1271,11 +1273,11 @@ FakeContext.prototype.unpause = function() { this.flush(); }; FakeContext.prototype.flush = function() { - var pending = this.meta.pending; - var len = pending.length; + const pending = this.meta.pending; + const len = pending.length; if (!len) return; this.meta.pending = []; - for (var i = 0; i < len; i++) { + for (const i = 0; i < len; i++) { pending[i](); } };