1 | import * as simulant from 'simulant';
|
2 | import * as assert from 'assert';
|
3 | import isolate from '@cycle/isolate';
|
4 | import xs, {Stream, MemoryStream} from 'xstream';
|
5 | import delay from 'xstream/extra/delay';
|
6 | import concat from 'xstream/extra/concat';
|
7 | import {setup} from '@cycle/run';
|
8 | import {
|
9 | svg,
|
10 | div,
|
11 | span,
|
12 | h2,
|
13 | h3,
|
14 | h4,
|
15 | p,
|
16 | makeDOMDriver,
|
17 | MainDOMSource,
|
18 | VNode,
|
19 | } from '../../src/index';
|
20 |
|
21 | function createRenderTarget(id: string | null = null) {
|
22 | const element = document.createElement('div');
|
23 | element.className = 'cycletest';
|
24 | if (id) {
|
25 | element.id = id;
|
26 | }
|
27 | document.body.appendChild(element);
|
28 | return element;
|
29 | }
|
30 |
|
31 | describe('DOMSource.elements()', function() {
|
32 | it('should return a stream of documents when querying "document"', done => {
|
33 | function app(_sources: {DOM: MainDOMSource}) {
|
34 | return {
|
35 | DOM: xs.of(div('.top-most', [p('Foo'), span('Bar')])),
|
36 | };
|
37 | }
|
38 |
|
39 | const {sinks, sources, run} = setup(app, {
|
40 | DOM: makeDOMDriver(createRenderTarget()),
|
41 | });
|
42 |
|
43 | function isDocument(element: any): element is Document {
|
44 | return 'body' in element && 'head' in element;
|
45 | }
|
46 |
|
47 | let dispose: any;
|
48 | sources.DOM.select('document')
|
49 | .element()
|
50 | .take(1)
|
51 | .addListener({
|
52 | next: root => {
|
53 | assert(root.body !== undefined);
|
54 | assert(isDocument(root));
|
55 | setTimeout(() => {
|
56 | dispose();
|
57 | done();
|
58 | });
|
59 | },
|
60 | });
|
61 | dispose = run();
|
62 | });
|
63 |
|
64 | it('should return a stream of bodies when querying "body"', done => {
|
65 | function app(_sources: {DOM: MainDOMSource}) {
|
66 | return {
|
67 | DOM: xs.of(div('.top-most', [p('Foo'), span('Bar')])),
|
68 | };
|
69 | }
|
70 |
|
71 | const {sinks, sources, run} = setup(app, {
|
72 | DOM: makeDOMDriver(createRenderTarget()),
|
73 | });
|
74 |
|
75 | function isBody(element: any): element is HTMLBodyElement {
|
76 | return 'aLink' in element && 'link' in element;
|
77 | }
|
78 |
|
79 | let dispose: any;
|
80 | sources.DOM.select('body')
|
81 | .element()
|
82 | .take(1)
|
83 | .addListener({
|
84 | next: root => {
|
85 | assert(root.aLink !== undefined);
|
86 | assert(isBody(root));
|
87 | setTimeout(() => {
|
88 | dispose();
|
89 | done();
|
90 | });
|
91 | },
|
92 | });
|
93 | dispose = run();
|
94 | });
|
95 |
|
96 | it('should return a stream of arrays of elements of size 1 when querying ":root"', done => {
|
97 | function app(_sources: {DOM: MainDOMSource}) {
|
98 | return {
|
99 | DOM: xs.of(div('.top-most', [p('Foo'), span('Bar')])),
|
100 | };
|
101 | }
|
102 |
|
103 | const {sinks, sources, run} = setup(app, {
|
104 | DOM: makeDOMDriver(createRenderTarget()),
|
105 | });
|
106 |
|
107 | let dispose: any;
|
108 | sources.DOM.select(':root')
|
109 | .elements()
|
110 | .drop(1)
|
111 | .take(1)
|
112 | .addListener({
|
113 | next: root => {
|
114 | assert(root.forEach !== undefined);
|
115 | assert(Array.isArray(root));
|
116 | assert(root.length === 1);
|
117 | setTimeout(() => {
|
118 | dispose();
|
119 | done();
|
120 | });
|
121 | },
|
122 | });
|
123 | dispose = run();
|
124 | });
|
125 |
|
126 | it('should return a stream of arrays of elements of size 2 when querying ".some"', done => {
|
127 | function app(_sources: {DOM: MainDOMSource}) {
|
128 | return {
|
129 | DOM: xs.of(div('.top-most', [div('.some'), div('.some')])),
|
130 | };
|
131 | }
|
132 |
|
133 | const {sinks, sources, run} = setup(app, {
|
134 | DOM: makeDOMDriver(createRenderTarget()),
|
135 | });
|
136 |
|
137 | let dispose: any;
|
138 | sources.DOM.select('.some')
|
139 | .elements()
|
140 | .drop(1)
|
141 | .take(1)
|
142 | .addListener({
|
143 | next: (elems: Array<Element>) => {
|
144 | assert(Array.isArray(elems));
|
145 | assert(elems.length === 2);
|
146 | setTimeout(() => {
|
147 | dispose();
|
148 | done();
|
149 | });
|
150 | },
|
151 | });
|
152 | dispose = run();
|
153 | });
|
154 | });
|