diff --git a/tests/unit/utils/DebugDashboard.js b/tests/unit/utils/DebugDashboard.js index 03231016..573616f2 100644 --- a/tests/unit/utils/DebugDashboard.js +++ b/tests/unit/utils/DebugDashboard.js @@ -32,5 +32,6 @@ describe('clickHandler', function () { i13nNode.setDOMNode(domNode); var debugDashboard = new DebugDashboard(i13nNode); expect(document.getElementById('i13n-debug-0')).to.be.an('object'); + debugDashboard.destroy(); }); }); diff --git a/tests/unit/utils/createI13nNode.js b/tests/unit/utils/createI13nNode.js index 6048bf80..d12a7a45 100644 --- a/tests/unit/utils/createI13nNode.js +++ b/tests/unit/utils/createI13nNode.js @@ -5,6 +5,7 @@ /* globals describe,it,document,beforeEach,afterEach */ 'use strict'; +/* I13nMixin, I13nUtils, ViewportMixin are mainly tested with this higher order component */ var expect = require('expect.js'); var jsdom = require('jsdom'); var mockery = require('mockery'); @@ -23,11 +24,21 @@ var mockData = { isViewportEnabled: false }; var MockReactI13n = {}; -var mockViewport = {} +var mockSubscribeHandler = null; +var mockSubscribe = { + subscribe: function (eventName, handler) { + mockSubscribeHandler = handler; + return { + unsubscribe: function () { + } + } + } +}; var mockClickHandler = function () {}; MockReactI13n.getInstance = function () { return mockData.reactI13n; }; + describe('createI13nNode', function () { beforeEach(function (done) { jsdom.env('', [], function (err, window) { @@ -46,7 +57,7 @@ describe('createI13nNode', function () { ReactTestUtils = require('react/lib/ReactTestUtils'); mockery.registerMock('../libs/ReactI13n', MockReactI13n); - mockery.registerMock('./viewport/ViewportMixin', mockViewport); + mockery.registerMock('subscribe-ui-event', mockSubscribe); mockery.registerMock('../utils/clickHandler', mockClickHandler); createI13nNode = require('../../../../dist/utils/createI13nNode'); @@ -65,16 +76,6 @@ describe('createI13nNode', function () { return mockData.isViewportEnabled; } }; - - mockViewport = { - _detectViewport: function () {}, - _detectHidden: function () {}, - onEnterViewport: function (handler) { - mockViewport._handleEnterViewport = handler; - }, - subscribeViewportEvents: function () {}, - unsubscribeViewportEvents: function () {} - }; done(); }); @@ -203,6 +204,7 @@ describe('createI13nNode', function () { }); it('should handle scan the links inside if autoScanLinks is enable', function (done) { + mockData.isViewportEnabled = false; var TestComponent = React.createClass({ displayName: 'TestComponent', render: function() { @@ -296,29 +298,67 @@ describe('createI13nNode', function () { }); it('should handle the case if we enable viewport checking', function (done) { + var TestSubComponent = React.createClass({ + displayName: 'TestSubComponent', + render: function() { + return React.createElement('div'); + } + }); + var I13nTestSubComponent = createI13nNode(TestSubComponent); var TestComponent = React.createClass({ displayName: 'TestComponent', render: function() { - return React.createElement('div'); + return React.createElement(I13nTestSubComponent); } }); - mockData.isViewportEnabled = true; var I13nTestComponent = createI13nNode(TestComponent); - mockData.reactI13n.execute = function (eventName) { - // should get a created event - expect(eventName).to.eql('created'); + mockData.isViewportEnabled = true; + var executedArray = []; + mockData.reactI13n.execute = function (eventName, payload) { + executedArray.push(eventName); }; var container = document.createElement('div'); var component = React.render(React.createElement(I13nTestComponent, {}), container); - expect(rootI13nNode.getChildrenNodes()[0].isInViewport()).to.eql(false); - expect(component).to.be.an('object'); - mockData.reactI13n.execute = function (eventName) { - // should get a created event - expect(eventName).to.eql('enterViewport'); + // we wait 500ms and batch the viewport detection, wait 1000ms here util it's finished + setTimeout(function () { + expect(executedArray[0]).to.be.equal('created'); + expect(executedArray[1]).to.be.equal('created'); + expect(executedArray[2]).to.be.equal('enterViewport'); + expect(executedArray[3]).to.be.equal('enterViewport'); done(); + }, 1000); + }); + + it('should handle the case if we enable viewport checking with subComponents generated by scanLinks', function (done) { + mockData.isViewportEnabled = true; + var TestComponent = React.createClass({ + displayName: 'TestComponent', + render: function() { + return React.createElement("div", null, + React.createElement("a", {href: "/foo"}, "foo"), + React.createElement("button", null, "bar") + ); + } + }); + var I13nTestComponent = createI13nNode(TestComponent); + var container = document.createElement('div'); + // should get three created events + var executedArray = []; + mockData.reactI13n.execute = function (eventName) { + executedArray.push(eventName); }; - mockViewport._handleEnterViewport(); // enter the viewport - expect(rootI13nNode.getChildrenNodes()[0].isInViewport()).to.eql(true); + var component = React.render(React.createElement(I13nTestComponent, {scanLinks: {enable: true}}), container); + // we wait 500ms and batch the viewport detection, wait 1000ms here util it's finished + setTimeout(function () { + expect(executedArray[0]).to.be.equal('created'); + expect(executedArray[1]).to.be.equal('created'); + expect(executedArray[2]).to.be.equal('created'); + expect(executedArray[3]).to.be.equal('enterViewport'); + expect(executedArray[4]).to.be.equal('enterViewport'); + expect(executedArray[5]).to.be.equal('enterViewport'); + React.unmountComponentAtNode(container); + done(); + }, 1000); }); it('should not cause error if we pass a undefined to createI13nNode', function () {