First Guided Tour
Change-Id: Ia0d71307ba6a88c6037598cb7e500372780136b6
diff --git a/dev/js/spec/tourSpec.js b/dev/js/spec/tourSpec.js
new file mode 100644
index 0000000..bb5df70
--- /dev/null
+++ b/dev/js/spec/tourSpec.js
@@ -0,0 +1,75 @@
+/**
+ * Test suite for guided tour.
+ *
+ * @author Helge Stallkamp
+ */
+
+define(['tour/tours', 'vc'], function(tourClass, vcClass){
+ const loc = KorAP.Locale;
+
+ //TODO Read this file from the file system, see https://korap.ids-mannheim.de/gerrit/#/c/KorAP/Kalamar/+/2241/
+ var introKorAP = "<form autocomplete='off' action='/' id='searchform'>" +
+ "<div id='searchbar'>" +
+ "<input autocapitalize='off' autocomplete='off ' autocorrect='off' autofocus='autofocus' id='q-field' name='q' placeholder='Find ...' spellcheck='false' type='search'>" +
+ "<button type='submit' title='Go!'><span>Go!</span></button>" +
+ "</div>"+
+ "<!-- Search in the following virtual collection -->"+
+ "<div id='vc-view'></div>" +
+ "in" +
+ "<input id='collection' name='collection' type='text'>" +
+ "with" +
+ "<span class='select'>" +
+ "<select id='ql-field' name='ql'><option value='poliqarp'>Poliqarp</option><option value='cosmas2'>Cosmas II</option><option value='annis'>Annis QL</option><option value='cql'>CQL v1.2</option><option value='fcsql'>FCSQL</option></select>" +
+ "</span>" +
+ "<div class='button right'>" +
+ "<input checked class='checkbox' id='q-cutoff-field' name='cutoff' type='checkbox' value='1'>"+
+ "<label for='q-cutoff-field' title='Just show the first matches in arbitrary order'><span id='glimpse-intrjs'></span>Glimpse</label>" +
+ "<a class='tutorial' href='/doc' id='view-tutorial' tabindex='-1' title='Tutorial'><span>Tutorial</span></a>" +
+ "</div>" +
+ "<div class='clear'></div>" +
+ "</form>";
+
+ let template = document.createElement('template');
+ html = introKorAP.trim(); // Do not return a text node of whitespace as the result
+ template.innerHTML = html;
+ intrkorap = template.content.firstChild;
+
+
+ //TODO Add hint and vc-choose, they are not part of the generated file
+ describe('KorAP.GuidedTour', function(){
+ it('IDs and classes, that are needed for the guided tour should be in existence', function(){
+ expect(intrkorap.querySelector('#searchbar')).not.toBeNull();
+ expect(intrkorap.querySelector('#q-field')).not.toBeNull();
+ //expect(intrkorap.querySelector('#hint')).not.toBeNull();
+ //expect(intrkorap.querySelector('#vc-choose')).not.toBeNull();
+ expect(intrkorap.querySelector('#vc-view')).not.toBeNull();
+ expect(intrkorap.querySelector('#ql-field').parentNode).not.toBeNull();
+ expect(intrkorap.querySelector('#glimpse-intrjs')).not.toBeNull();
+ expect(intrkorap.querySelector('#view-tutorial')).not.toBeNull();
+ expect(intrkorap.querySelector('#searchbar button[type=submit]')).not.toBeNull();
+ });
+
+
+ it('Guided Tour should be started and display steps and labels in the right order', function(){
+ let testTour = tourClass.guidedTour(intrkorap);
+ testTour.start();
+ let totalSteps = testTour.stepCount;
+
+ expect(document.querySelector(".introjs-tooltiptext").textContent).toEqual(loc.TOUR_sear1);
+ expect(document.querySelector(".introjs-skipbutton").textContent).toEqual(loc.TOUR_lskip);
+ expect(document.querySelector(".introjs-prevbutton").textContent).toEqual(loc.TOUR_lprev);
+ expect(document.querySelector(".introjs-nextbutton").textContent).toEqual(loc.TOUR_lnext);
+ testTour.exit();
+
+ for(let i = 2; i <= totalSteps; i++){
+ testTour.goToStepNumber(i);
+ expect(document.querySelector(".introjs-tooltiptext").textContent).toEqual(testTour.testIntros[i-1]);
+ if(i == totalSteps){
+ expect(document.querySelector('.introjs-donebutton').textContent).toEqual(loc.TOUR_ldone);
+ }
+ testTour.exit();
+ }
+ });
+ });
+}
+);