diff --git a/Gruntfile.js b/Gruntfile.js index d7ee290..32f3a1c 100644 --- a/Gruntfile.js +++ b/Gruntfile.js @@ -11,19 +11,28 @@ module.exports = function(grunt) { dest: 'shower.min.js' } }, - dalek: { - test: { - src: [ - 'tests/shortcuts.js', - 'tests/inner-nav.js' - ] + connect: { + ribbon: { + options: { + port: 7497 + } } + }, + dalek: { + options: { + browser: ['chrome'] + }, + src: [ + 'tests/*.js' + ] } }); grunt.loadNpmTasks('grunt-contrib-uglify'); + grunt.loadNpmTasks('grunt-contrib-connect'); grunt.loadNpmTasks('grunt-dalek'); grunt.registerTask('default', ['uglify']); + grunt.registerTask('test', ['connect', 'dalek']); }; \ No newline at end of file diff --git a/package.json b/package.json index b15d0f4..70098ca 100644 --- a/package.json +++ b/package.json @@ -6,9 +6,11 @@ "private": true, "devDependencies": { "dalekjs": "0.0.8", + "dalek-browser-chrome": "0.0.9", "grunt": "~0.4.2", - "grunt-contrib-uglify": "~0.3.0", + "grunt-contrib-uglify": "~0.3.2", "grunt-dalek": "~0.2.0", - "grunt-contrib-watch": "~0.5.3" + "grunt-contrib-watch": "~0.5.3", + "grunt-contrib-connect": "~0.6.0" } } diff --git a/tests/index.html b/tests/index.html new file mode 100644 index 0000000..19d615a --- /dev/null +++ b/tests/index.html @@ -0,0 +1,34 @@ + + + + Test page for Shower + + + + + + +
+

1

+
+
+

2

+
+
+

3

+
+
+

4

+
+
+

5

+ + + +
+
+

6

+
+ + + \ No newline at end of file diff --git a/tests/inner-nav.js b/tests/inner-nav.js deleted file mode 100644 index 5b077d4..0000000 --- a/tests/inner-nav.js +++ /dev/null @@ -1,10 +0,0 @@ -module.exports = { - // Right - 'Right Arrow key is switching .next to .active': function (test) { - test - .open('themes/ribbon/index.html?full#20') - .sendKeys('body', '\uE014') // Right - .assert.attr('[id="20"] li:nth-child(2)', 'class', 'next active', 'First .next is .active') - .done(); - } -}; \ No newline at end of file diff --git a/tests/navigation.js b/tests/navigation.js new file mode 100644 index 0000000..31eb387 --- /dev/null +++ b/tests/navigation.js @@ -0,0 +1,48 @@ +module.exports = { + 'Right Arrow key is switching first Next item to Active': function (test) { + test + .open('http://localhost:7497/tests/?full#5') + .sendKeys('body', '\uE014') // Right + .assert.attr('[id="5"] .next:first-of-type', 'class').to.contain('active', 'First Next item is Active') + .done(); + }, + 'Left Arrow key is switching Active items back to Next': function (test) { + test + .open('http://localhost:7497/tests/?full#5') + .sendKeys('body', '\uE014') // Right + .sendKeys('body', '\uE014') // Right + .sendKeys('body', '\uE012') // Left + .sendKeys('body', '\uE012') // Left + .assert.numberOfElements('[id="5"] .next.active', 0, 'There are no Active items') + .done(); + }, + 'Right Arrow key is switching to next slide once all Next items becomes Active': function (test) { + test + .open('http://localhost:7497/tests/?full#5') + .sendKeys('body', '\uE014') // Right + .sendKeys('body', '\uE014') // Right + .sendKeys('body', '\uE014') // Right + .sendKeys('body', '\uE014') // Right + .assert.attr('[id="6"]', 'class').to.contain('active', 'Next slide is Active') + .done(); + }, + 'Left Arrow key is switching to previous slide when all Next items becomes Active': function (test) { + test + .open('http://localhost:7497/tests/?full#5') + .sendKeys('body', '\uE014') // Right + .sendKeys('body', '\uE014') // Right + .sendKeys('body', '\uE014') // Right + .sendKeys('body', '\uE012') // Left + // Not sure why it’s failing. It works fine manually + .assert.attr('[id="4"]', 'class').to.contain('active', 'Previous slide is Active') + .done(); + }, + 'Reload reset navigation': function (test) { + test + .open('http://localhost:7497/tests/?full#5') + .sendKeys('body', '\uE014') // Right + .reload() + .assert.numberOfElements('[id="5"] .next.active', 0, 'There are no Active items') + .done(); + } +}; \ No newline at end of file diff --git a/tests/shortcuts.js b/tests/shortcuts.js index d614533..dac0c16 100644 --- a/tests/shortcuts.js +++ b/tests/shortcuts.js @@ -1,75 +1,250 @@ module.exports = { - 'Body class is switching from `list` to `full` on F5': function (test) { - test - .open('themes/ribbon/index.html') - .sendKeys('body', '\uE035') // F5 - .assert.attr('body', 'class', 'full', 'Mode is full') - .done(); - }, + // -------------------------------- // F5 - 'Body class is switching from `full` to `list` on F5': function (test) { + // -------------------------------- + 'F5 is switching from List to Full': function (test) { test - .open('themes/ribbon/index.html?full') + .open('http://localhost:7497/tests/') .sendKeys('body', '\uE035') // F5 - .assert.attr('body', 'class', 'list', 'Mode is list') + .assert.attr('body', 'class', 'full', 'Mode is Full') .done(); }, - // Cmd Alt P — how to test multiple keys? - // 'Body class is switching from `list` to `full` on Cmd Alt P': function (test) { - // test - // .open('themes/ribbon/index.html') - // .sendKeys('body', '\uE03D\uE00A\u0050') // Cmd Alt P - // .assert.attr('body', 'class', 'full') - // .done(); - // }, + 'F5 is switching from Full to List': function (test) { + test + .open('http://localhost:7497/tests/?full') + .sendKeys('body', '\uE035') // F5 + .assert.attr('body', 'class', 'list', 'Mode is List') + .done(); + }, + // -------------------------------- + // Cmd Alt P + // -------------------------------- + 'Cmd Alt P keys are switching from List to Full': function (test) { + test + .open('http://localhost:7497/tests/') + .sendKeys('body', '\uE03D\uE00A\u0070') // Cmd Alt P + .assert.attr('body', 'class', 'full', 'Mode is Full') + .done(); + }, + 'Cmd Alt P keys are not switching from Full to List': function (test) { + test + .open('http://localhost:7497/tests/?full#1') + .sendKeys('body', '\uE03D\uE00A\u0070') // Cmd Alt P + .assert.attr('body', 'class', 'full', 'Mode is Full') + .done(); + }, + // -------------------------------- // Esc - 'Body class is switching from `full` to `list` on Esc': function (test) { + // -------------------------------- + 'Esc is switching from Full to List': function (test) { test - .open('themes/ribbon/index.html?full') + .open('http://localhost:7497/tests/?full#1') .sendKeys('body', '\uE00C') // Esc - .assert.attr('body', 'class', 'list', 'Mode is list') + .assert.attr('body', 'class').to.contain('list', 'Mode is List') .done(); }, - // End - 'End key select the last slide': function (test) { + // -------------------------------- + // Left + // -------------------------------- + 'Left Arrow key is switching to the previous slide': function (test) { test - .open('themes/ribbon/index.html') - .sendKeys('body', '\uE010') // End - .assert.attr('.slide:last-of-type', 'class', 'slide active', 'Last slide is active') + .open('http://localhost:7497/tests/?full#2') + .sendKeys('body', '\uE012') // Left + .assert.attr('[id="1"]', 'class').to.contain('active', 'Previous slide is Active') .done(); }, + // -------------------------------- + // Right + // -------------------------------- + 'Right Arrow key is switching to the next slide': function (test) { + test + .open('http://localhost:7497/tests/?full#1') + .sendKeys('body', '\uE014') // Right + .assert.attr('[id="2"]', 'class').to.contain('active', 'Next slide is Active') + .done(); + }, + // -------------------------------- + // Up + // -------------------------------- + 'Up Arrow key is switching to the previous slide': function (test) { + test + .open('http://localhost:7497/tests/?full#2') + .sendKeys('body', '\uE013') // Up + .assert.attr('[id="1"]', 'class').to.contain('active', 'Previous slide is Active') + .done(); + }, + // -------------------------------- + // Down + // -------------------------------- + 'Down Arrow key is switching to the next slide': function (test) { + test + .open('http://localhost:7497/tests/?full#1') + .sendKeys('body', '\uE015') // Down + .assert.attr('[id="2"]', 'class').to.contain('active', 'Next slide is Active') + .done(); + }, + // -------------------------------- + // H + // -------------------------------- + 'H key is switching to the previous slide': function (test) { + test + .open('http://localhost:7497/tests/?full#2') + .sendKeys('body', '\u0068') // H + .assert.attr('[id="1"]', 'class').to.contain('active', 'Previous slide is Active') + .done(); + }, + // -------------------------------- + // K + // -------------------------------- + 'K key is switching to the previous slide': function (test) { + test + .open('http://localhost:7497/tests/?full#2') + .sendKeys('body', '\u006B') // K + .assert.attr('[id="1"]', 'class').to.contain('active', 'Previous slide is Active') + .done(); + }, + // -------------------------------- + // J + // -------------------------------- + 'J key is switching to the next slide': function (test) { + test + .open('http://localhost:7497/tests/?full#1') + .sendKeys('body', '\u006A') // J + .assert.attr('[id="2"]', 'class').to.contain('active', 'Next slide is Active') + .done(); + }, + // -------------------------------- + // L + // -------------------------------- + 'L key is switching to the next slide': function (test) { + test + .open('http://localhost:7497/tests/?full#1') + .sendKeys('body', '\u006C') // L + .assert.attr('[id="2"]', 'class').to.contain('active', 'Next slide is Active') + .done(); + }, + // -------------------------------- + // Space + // -------------------------------- + 'Space key is switching to the next slide': function (test) { + test + .open('http://localhost:7497/tests/?full#1') + .sendKeys('body', '\uE00D') // Space + .assert.attr('[id="2"]', 'class').to.contain('active', 'Next slide is Active') + .done(); + }, + 'Shift Space keys are switching to the previous slide': function (test) { + test + .open('http://localhost:7497/tests/?full#2') + .sendKeys('body', '\uE008\uE00D') // Shift Space + .assert.attr('[id="1"]', 'class').to.contain('active', 'Previous slide is Active') + .done(); + }, + // -------------------------------- + // Tab + // -------------------------------- + 'Tab key is switching to the next slide': function (test) { + test + .open('http://localhost:7497/tests/?full#1') + .sendKeys('body', '\uE004') // Tab + // Not sure why it’s failing. It works fine manually + .assert.attr('[id="2"]', 'class').to.contain('active', 'Next slide is Active') + .done(); + }, + 'Shift Tab keys are switching to the previous slide': function (test) { + test + .open('http://localhost:7497/tests/?full#2') + .sendKeys('body', '\uE008\uE004') // Shift Tab + // Not sure why it’s failing. It works fine manually + .assert.attr('[id="1"]', 'class').to.contain('active', 'Previous slide is Active') + .done(); + }, + // -------------------------------- + // PageUp + // -------------------------------- + 'PageUp key is switching to the previous slide': function (test) { + test + .open('http://localhost:7497/tests/?full#2') + .sendKeys('body', '\uE00E') // PageUp + .assert.attr('[id="1"]', 'class').to.contain('active', 'Previous slide is Active') + .done(); + }, + // -------------------------------- + // PageDown + // -------------------------------- + 'PageDown key is switching to the next slide': function (test) { + test + .open('http://localhost:7497/tests/?full#1') + .sendKeys('body', '\uE00F') // PageDown + .assert.attr('[id="2"]', 'class').to.contain('active', 'Next slide is Active') + .done(); + }, + // -------------------------------- // Home - 'Home key select the first slide': function (test) { + // -------------------------------- + 'Home key select the first slide in List mode': function (test) { test - .open('themes/ribbon/index.html#20') + .open('http://localhost:7497/tests/') .sendKeys('body', '\uE011') // Home - .assert.attr('.slide:first-of-type', 'class', 'slide active', 'First slide is active') + // Failing unlike next one with current slide + .assert.attr('[id="1"]', 'class').to.contain('active', 'First slide is active') .done(); }, + 'Home key select the first slide in List mode (with current)': function (test) { + test + .open('http://localhost:7497/tests/#5') + .sendKeys('body', '\uE011') // Home + .assert.attr('[id="1"]', 'class').to.contain('active', 'First slide is active') + .done(); + }, + 'Home key select the first slide in Full mode': function (test) { + test + .open('http://localhost:7497/tests/?full#5') + .sendKeys('body', '\uE011') // Home + .assert.attr('[id="1"]', 'class').to.contain('active', 'First slide is active') + .done(); + }, + // -------------------------------- + // End + // -------------------------------- + 'End key select the last slide in List mode': function (test) { + test + .open('http://localhost:7497/tests/') + .sendKeys('body', '\uE010') // End + // Failing unlike next one with current slide + .assert.attr('[id="6"]', 'class').to.contain('active', 'Last slide is active') + .done(); + }, + 'End key select the last slide in List mode (with current)': function (test) { + test + .open('http://localhost:7497/tests/#1') + .sendKeys('body', '\uE010') // End + .assert.attr('[id="6"]', 'class').to.contain('active', 'Last slide is active') + .done(); + }, + 'End key select the last slide in Full mode': function (test) { + test + .open('http://localhost:7497/tests/?full#1') + .sendKeys('body', '\uE010') // End + .assert.attr('[id="6"]', 'class').to.contain('active', 'Last slide is active') + .done(); + }, + // -------------------------------- // Enter + // -------------------------------- 'Enter is opening current slide': function (test) { test - .open('themes/ribbon/index.html#1') + .open('http://localhost:7497/tests/#1') .sendKeys('body', '\uE007') // Enter .assert.attr('body', 'class', 'full', 'Full mode') - .assert.attr('[id="1"]', 'class', 'slide active', 'Slide #1 is active') + .assert.attr('[id="1"]', 'class').to.contain('active', 'First slide is active') .done(); }, - // Enter 'Enter is not opening any slide if there’s no current': function (test) { test - .open('themes/ribbon/index.html') + .open('http://localhost:7497/tests/') .sendKeys('body', '\uE007') // Enter - .assert.attr('body', 'class', 'list', 'Mode is list') + .assert.attr('body', 'class', 'list', 'Mode is List') .done(); } - // uE004 Tab - // uE008 Shift - // uE00D Space - // uE00E PageUp - // uE00F PageDown - // uE012 Left - // uE013 Up - // uE014 Right - // uE015 Down }; \ No newline at end of file diff --git a/tests/timer.js b/tests/timer.js new file mode 100644 index 0000000..a6412ab --- /dev/null +++ b/tests/timer.js @@ -0,0 +1,31 @@ +module.exports = { + 'Timer is switching to the next slide when finished': function (test) { + test + .open('http://localhost:7497/tests/?full#3') + .wait(5000) + .assert.attr('[id="4"]', 'class').to.contain('active', 'Next slide is Active') + .done(); + }, + 'Timer becomes Active and switching to the next slide when finished': function (test) { + test + .open('http://localhost:7497/tests/?full#4') + .sendKeys('body', '\uE012') // Left + .wait(5000) + .assert.attr('[id="4"]', 'class').to.contain('active', 'Next slide is Active') + .done(); + }, + 'Left Arrow key is skipping timer while it’s not finished': function (test) { + test + .open('http://localhost:7497/tests/?full#3') + .sendKeys('body', '\uE012') // Left + .assert.attr('[id="2"]', 'class').to.contain('active', 'Previous slide is Active') + .done(); + }, + 'Right Arrow key is skipping timer while it’s not finished': function (test) { + test + .open('http://localhost:7497/tests/?full#3') + .sendKeys('body', '\uE014') // Right + .assert.attr('[id="4"]', 'class').to.contain('active', 'Next slide is Active') + .done(); + } +}; \ No newline at end of file