From 5438997b87a1526b6d122741ef2174bacd31d1d5 Mon Sep 17 00:00:00 2001 From: Robert Biggs Date: Sun, 29 Sep 2019 10:31:45 -0700 Subject: [PATCH] Updated runtime test. 1. Previous runtime tests were not passing due to changes in how subscriptions work. Updated them to pass. --- CHANGELOG.md | 6 ++ package-lock.json | 2 +- package.json | 2 +- test/runtime.html | 172 +++++++++++++++++++++++++++++----------------- 4 files changed, 116 insertions(+), 66 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 1bbb7be..0c5e12f 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,11 @@ # composi/core Changelog +## 1.6.15 (September 29, 2019) + +### test/runtime.html + +* Updated runtime tests to handle latest version of subscriptions properly. + ## 1.6.14 (September 27, 2019) * Made improvements to JSDocs comments for better Intellisense for `h`, `union` and runtime types. diff --git a/package-lock.json b/package-lock.json index b9f66a4..99455be 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "@composi/core", - "version": "1.6.14", + "version": "1.6.15", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/package.json b/package.json index 9e55dbe..0ad44c0 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@composi/core", - "version": "1.6.14", + "version": "1.6.15", "description": "A JavaScript library for creating websites, PWAs and hybrid apps.", "main": "src/index.js", "module": "dist/composi-core.mjs", diff --git a/test/runtime.html b/test/runtime.html index 3c8a514..33a309f 100755 --- a/test/runtime.html +++ b/test/runtime.html @@ -29,7 +29,9 @@

Mocha Tests - Composi Runtime & Union

-
+
+
+
@@ -453,21 +455,21 @@

Mocha Tests - Composi Runtime & Union

describe('Should be able to launch subscriptions at start.', function () { it('subscription should run at startup.', done => { let effectResult = false - function effect() { + function effect(getState, send) { effectResult = true } const program = { init() { return [0] }, - update() { - return [state] + update(state, msg, send) { + return [msg.data] }, view() { return }, - subscriptions() { - return effect + subscriptions(getState, send) { + return effect(getState, send) } } run(program) @@ -480,12 +482,19 @@

Mocha Tests - Composi Runtime & Union

describe('Subscription should be able to access state and send message to action.', function() { let state = 'initial state' - let newState = '' - - let msgWasSent = false - function effect(state, send) { - send({type: 'update-state', value: state}) - + const test = document.querySelector('#subscription-test3') + function Component({state, send}) { + return ( + h('div', + {}, + [state]) + ) + } + function effect(getState, send) { + const currentState = getState() + if (currentState === 'initial state') { + send({type: 'update-state', value: 'new state'}) + } } const program = { init() { @@ -493,27 +502,21 @@

Mocha Tests - Composi Runtime & Union

}, update(state, msg) { if (msg.type === 'update-state') { - newState = msg.value - msgWasSent = true - return [state] + return [msg.value] } }, - view() { - return + view(state, send) { + return render(Component({state, send}), test) }, - subscriptions(state, send) { - return (state, send) => { - send({type: 'update-state', value: state}) - } + subscriptions(getState, send) { + return effect(getState, send) } } run(program) - it('Subscription should have access to state.', done => { - expect(state).to.equal('initial state') - done() - }) - it('Subscription should be able to send message to action.', done => { - expect(msgWasSent).to.equal(true) + it('Subscription should have access to state and send message to program\'s update method.', done => { + setTimeout(() => { + expect(test.textContent).to.equal('new state') + }, 1000) done() }) }) @@ -535,9 +538,9 @@

Mocha Tests - Composi Runtime & Union

return }, subs(getState, send) { - // Should be able to access state from subscription: + // Should be able to access program state from subscription: expect(getState()).to.equal(1) - return effect + return effect(getState, send) } } run(program) @@ -548,63 +551,102 @@

Mocha Tests - Composi Runtime & Union

}) }) describe('Should be able to run batched subscriptions.', function() { + const test = document.querySelector('#subscription-test2') - let result1 = '' - let result2 = '' - let count = 5 - const hello = () => { - result1 = 'Hello World!' + const state = { + count: 5, + result1: '1', + result2: '2' } - const secondEffect = () => { - result2 = 'Second effect ran!' + + function hello(getState, send) { + send({type: 'result1', value: 'Hello World!'}) } - const countDown = () => { + const secondEffect = (getState, send) => { + send({type: 'result2', value: 'Second effect ran!'}) + } + const countDown = (getState, send) => { const id = setInterval(() => { + const {count} = getState() if (count === 0) { clearInterval(id) } else { - count-- + send({type: 'reduce'}) } }, 100) } - const subscriptions = batchEffects(hello, secondEffect, countDown) + + + const subs = batchEffects(hello, secondEffect, countDown) + + function Component({state}) { + return h( + 'ul', + {}, + [ + h('li', {}, state.result1), + h('li', {}, state.result2), + h('li', {}, state.count), + ] + ) + } const program = { init() { - return ['World'] + return [state] }, - update() {}, - view() {}, - subscriptions(state, send) { - return subscriptions + view(state, send) { + return render(Component({state}), test) + }, + update(state, msg, send) { + if (msg.type === 'result1') { + state.result1 = msg.value + return [state] + } else if (msg.type === 'result2') { + state.result2 = msg.value + return [state] + } else if (msg.type === 'reduce') { + state.count -= 1 + return [state] + } + }, + subscriptions(getState, send) { + return subs(getState, send) } } - const endProgram = run(program) + run(program) it('batched subsriptions should run at startup.', done => { - endProgram() setTimeout(() => { - expect(result1).to.equal('Hello World!') - expect(result2).to.equal('Second effect ran!') - expect(count).to.equal(0) + const children = test.firstElementChild.children + expect(children[0].textContent).to.equal('Hello World!') + expect(children[1].textContent).to.equal('Second effect ran!') + expect(children[2].textContent).to.equal('0') }, 1000) done() }) }) describe('Batched subscriptions should have access to getState and send functions.', function() { - const subscriptionTest = document.querySelector('#subscription-test') - let state = 1 - let messageWasSent = false + const test = document.querySelector('#subscription-test1') + let state = { + count: 1, + messageWasSent: 'false' + } function effect1(getState, send) { - send({type: 'update-state-1', value: getState() + 1}) + const count = getState().count + send({type: 'update-state-1', value: parseInt(count) + 1}) } function effect2(getState, send) { - setTimeout(() => send({type: 'update-state-2', value: getState() + 2}), 1000) + const count = getState().count + setTimeout(() => send({type: 'update-state-2', value: parseInt(count) + 2}), 2000) } const batchedEffects = batchEffects(effect1, effect2) function subTest({state, send}) { - return h('div', {}, state) + return h('div', {}, [ + h('p', {}, state.count), + h('p', {}, state.messageWasSent) + ]) } const program = { init() { @@ -612,30 +654,32 @@

Mocha Tests - Composi Runtime & Union

}, update(state, msg) { if (msg.type === 'update-state-1') { - return [msg.value] + state.count = msg.value + return [state] } else if (msg.type === 'update-state-2') { - messageWasSent = true - return [msg.value] + state.messageWasSent = 'true' + state.count = msg.value + return [state] } }, view(state, send) { - return render(subTest({state, send}), subscriptionTest) + return render(subTest({state, send}), test) }, subscriptions(getState, send) { - return batchedEffects + return batchedEffects(getState, send) } } run(program) it('First effect should update state to 2.', function() { - expect(subscriptionTest.textContent).to.equal('2') + expect(test.firstElementChild.children[0].textContent).to.equal('2') }) - it('Second effect should update state to 3.', + it('Second effect should update state to 4.', function(done) { - setTimeout(() => expect(subscriptionTest.textContent).to.equal('4'), 1200) + setTimeout(() => expect(test.firstElementChild.children[0].textContent).to.equal('4'), 2000) done() }) it('Second effect should send message to update action, setting messageWasSent to true.', function(done) { - setTimeout(() => expect(messageWasSent).to.equal(true), 1200) + setTimeout(() => expect(test.firstElementChild.children[1].textContent).to.equal('true'), 2500) done() }) })