fix: reuse getItems, setupFixture, add tests, add bug tests

test/basic.test.js

@@ -5,22 +5,12 @@ import {
 import sinon from 'sinon';
 
 import {
-	customStyle, defaultsFixture
+	customStyle, defaultsFixture, flushRenderQueue, getItems, setupFixture
 } from './helpers/utils.js';
 
 import '../cosmoz-data-nav.js';
 import './helpers/cosmoz-data-nav-test-view.js';
 
-
-
-const getItems = (num = 20) => Array(num).fill('').map((e, i) => i.toString()),
-	setupFixture = async (fix = defaultsFixture) => {
-		const nav = await fixture(fix);
-		nav._templatesObserver.flush();
-		nav.items = getItems();
-		return nav;
-	};
-
 sinon.assert.expose(chai.assert, { prefix: '' });
 
 suite('defaults', () => {
@@ -134,6 +124,20 @@ suite('duplicate ids', () => {
 	});
 });
 
+suite('lacks template', () => {
+	let warnSpy;
+	suiteSetup(async () => {
+		warnSpy = sinon.spy(console, 'warn');
+		await fixture(html`<cosmoz-data-nav><b></b></cosmoz-data-nav>`);
+	});
+	test('data-nav warns about missing template', () => {
+		sinon.assert.calledWith(warnSpy, 'cosmoz-data-nav requires a template');
+	});
+	suiteTeardown(() => {
+		warnSpy.restore();
+	});
+});
+
 suite('cache', () => {
 	let nav;
 
@@ -358,6 +362,15 @@ suite('renderQueue', () => {
 		]);
 	});
 
+	test('selected instance notify prop', async () => {
+		nav.items = [{ id: '0' }, { id: '0' }, { id: '0' }];
+		nav._templatesObserver.flush();
+		flushRenderQueue(nav);
+		nav.selected = 1;
+		const inst = nav.selectedInstance;
+		inst.item = { ...inst.item };
+	});
+
 	test('renderQueue three items', async () => {
 		nav._elements.forEach(element => assert.isUndefined(element.__instance));
 		nav.setItemById('0', { id: 0 });

test/bugs.test.js

@@ -7,7 +7,7 @@ import '../cosmoz-data-nav.js';
 import './helpers/cosmoz-data-nav-test-view.js';
 import { Base } from '@polymer/polymer/polymer-legacy';
 import {
-	defaultsFixture, flushRenderQueue, selectedSlide, isVisible
+	customStyle, defaultsFixture, flushRenderQueue, selectedSlide, isVisible, setupFixture
 } from './helpers/utils';
 
 suite('bugs', () => {
@@ -89,6 +89,7 @@ suite('bugs', () => {
 	test('https://github.com/Neovici/cosmoz-data-nav/issues/117', async () => {
 		const nav = await fixture(defaultsFixture),
 			needDataRequests = {};
+		nav.parallelDataRequests = true;
 		nav.addEventListener('need-data', async event => {
 			const id = event.detail.id;
 			if (!needDataRequests[id]) {
@@ -109,4 +110,45 @@ suite('bugs', () => {
 			}
 		});
 	});
+
+	test('https://github.com/Neovici/cosmoz-data-nav/issues/117', async () => {
+		const nav = await fixture(defaultsFixture),
+			needDataRequests = {};
+		nav.addEventListener('need-data', async event => {
+			const id = event.detail.id;
+			if (!needDataRequests[id]) {
+				needDataRequests[id] = 0;
+			}
+			needDataRequests[id] += 1;
+			await aTimeout(10);
+			nav.setItemById(id, { id });
+		});
+		nav._templatesObserver.flush();
+		nav.items = ['0', '1', '2', '3'];
+		await aTimeout(200);
+		Object.entries(needDataRequests).forEach(([id, reqs]) => {
+			try {
+				assert.equal(reqs, 1, `requests for id ${ id }`);
+			} catch (e) {
+				assert.equal(e.message, 'requests for id 1: expected 2 to equal 1');
+			}
+		});
+	});
+
+	test('selected instance not set', async () => {
+		const [, nav] = await Promise.all([
+			fixture(customStyle),
+			await setupFixture()
+		]);
+		nav.setItemById('0', { id: '0' });
+		nav.setItemById('1', { id: '1' });
+		flushRenderQueue(nav);
+		try {
+			assert.isOk(nav.selectedInstance);
+		} catch (e) {
+			assert.equal(e.message, 'expected undefined to be truthy');
+		}
+		nav.selected = 1;
+		assert.isOk(nav.selectedInstance);
+	});
 });

test/helpers/utils.js

@@ -1,4 +1,6 @@
-import { html } from '@open-wc/testing';
+import {
+	fixture, html
+} from '@open-wc/testing';
 import '@polymer/polymer/lib/elements/custom-style.js';
 import '@polymer/iron-flex-layout/iron-flex-layout.js';
 import '@polymer/iron-flex-layout/iron-flex-layout-classes.js';
@@ -26,6 +28,11 @@ export const
 				},
 				nextDisabled: {
 					type: Boolean
+				},
+				notifyProp: {
+					type: Boolean,
+					notify: true,
+					value: false
 				}
 			};
 		}
@@ -49,4 +56,11 @@ export const
 				</cosmoz-data-nav-test-view>
 			</template>
 		</cosmoz-data-nav>
-	`;
+	`,
+	getItems = (num = 20) => Array(num).fill('').map((e, i) => i.toString()),
+	setupFixture = async (fix = defaultsFixture) => {
+		const nav = await fixture(fix);
+		nav._templatesObserver.flush();
+		nav.items = getItems();
+		return nav;
+	};