From 8bd05cf7a0e696eb5a086d76049b1f0fe857c175 Mon Sep 17 00:00:00 2001 From: Alan Friedman Date: Sat, 27 Feb 2016 11:24:28 -0500 Subject: [PATCH 1/2] Add ability to pass in class names to message log function --- src/js/chat.js | 11 ++++++----- 1 file changed, 6 insertions(+), 5 deletions(-) diff --git a/src/js/chat.js b/src/js/chat.js index 8f57887..e37a1df 100644 --- a/src/js/chat.js +++ b/src/js/chat.js @@ -23,6 +23,7 @@ export default class Chat { // Log a message log(message, options) { let html = options && options.html === true || false; + let classNames = options && options.classNames ? options.classNames : ''; let $el; let matchedUsernames = this.checkIfUsername(message.split(' ')); @@ -40,15 +41,15 @@ export default class Chat { } if (options && options.error) { - $el = $('
  • ').addClass('log').html('ERROR: ' + message); + $el = $('
  • ').addClass(`log ${classNames}`).html('ERROR: ' + message); } else if (options && options.warning) { - $el = $('
  • ').addClass('log').html('WARNING: ' + message); + $el = $('
  • ').addClass(`log ${classNames}`).html('WARNING: ' + message); } else if (options && options.notice) { - $el = $('
  • ').addClass('log').html('NOTICE: ' + message); + $el = $('
  • ').addClass(`log ${classNames}`).html('NOTICE: ' + message); } else if (options && options.info) { - $el = $('
  • ').addClass('log').html(message); + $el = $('
  • ').addClass(`log ${classNames}`).html(message); } else { - $el = $('
  • ').addClass('log').html(message); + $el = $('
  • ').addClass(`log ${classNames}`).html(message); } this.addMessageElement($el, options); From 9c16d73fefb15ccbfc506a2fb12a4d0ecba46e5f Mon Sep 17 00:00:00 2001 From: Alan Friedman Date: Sat, 27 Feb 2016 11:28:06 -0500 Subject: [PATCH 2/2] Cleanup tests MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Tests should now work in both Firefox and Chrome, but we can continue using Chrome for parity with Travis CI - When writing acceptance tests for Chrome, prefer using `waitForElementVisible` instead of `waitForElementPresent`. For whatever reason in Chrome, but not Firefox, elements can be briefly ‘present’ in the DOM but with no content, causing tests to fail. Waiting for visibility seems to solve this - Instead of using callbacks, we can simply chain browser async events --- src/js/chat.js | 6 +- src/js/main.js | 5 +- test/acceptance/app.js | 200 +++++++++++++-------------------- test/acceptance/fileUtility.js | 1 - 4 files changed, 84 insertions(+), 128 deletions(-) delete mode 100644 test/acceptance/fileUtility.js diff --git a/src/js/chat.js b/src/js/chat.js index e37a1df..0040a76 100644 --- a/src/js/chat.js +++ b/src/js/chat.js @@ -188,7 +188,11 @@ export default class Chat { if (!warned) { warned = true; - return this.log('Changing your username is currently in beta and your new username will be sent over the wire in plain text, unecrypted. This will be fixed in v2.0. If you really want to do this, type the command again.', {warning: true}); + return this.log('Changing your username is currently in beta and your new username will be sent over the wire in plain text, unecrypted. This will be fixed in v2.0. If you really want to do this, type the command again.', + { + warning: true, + classNames: 'change-username-warning' + }); } this.darkwire.updateUsername(newUsername).then((socketData) => { diff --git a/src/js/main.js b/src/js/main.js index fbc3954..48e251a 100644 --- a/src/js/main.js +++ b/src/js/main.js @@ -104,7 +104,10 @@ $(function() { socket.on('user update', (data) => { darkwire.updateUser(data).then((oldUsername) => { - chat.log(oldUsername + ' changed name to ' + data.username); + chat.log(oldUsername + ' changed name to ' + data.username, + { + classNames: 'changed-name' + }); renderParticipantsList(); }); }); diff --git a/test/acceptance/app.js b/test/acceptance/app.js index a9da54c..effde4f 100644 --- a/test/acceptance/app.js +++ b/test/acceptance/app.js @@ -42,6 +42,8 @@ describe('Darkwire', () => { describe('Joining chat room', () => { before((client, done) => { + // Close modal + browser.click('#first-modal .modal-footer button'); browser.url((result) => { let urlSplit = result.value.split('/'); testingRoom = urlSplit[urlSplit.length - 1]; @@ -52,6 +54,7 @@ describe('Darkwire', () => { browser.windowHandles((result) => { browser.switchWindow(result.value[1], () => { browser.execute((id) => { + // Open a new chat room at the same URL so we have 2 participants window.open('http://localhost:3000/' + id, '_self'); }, [testingRoom], () => { done(); @@ -69,52 +72,79 @@ describe('Darkwire', () => { describe('Sending chat message', () => { before((client, done) => { - browser.waitForElementPresent('ul.users li:nth-child(2)', 5000, () => { - browser.setValue('textarea.inputMessage', ['Hello world!', browser.Keys.RETURN], () => { + browser + .waitForElementPresent('ul.users li:nth-child(2)', 5000) + .waitForElementPresent('textarea.inputMessage', 5000) + .setValue('textarea.inputMessage', ['Hello world!', browser.Keys.RETURN], () => { + done(); + }); + }); + + it('Should send a message', (client) => { + browser.windowHandles((result) => { + browser.switchWindow(result.value[0], () => { + browser + .waitForElementVisible('span.messageBody', 5000) + .assert.containsText('span.messageBody', 'Hello world!'); + }); + }); + }); + + }); + + describe('Slash Commands', () => { + + describe('/me', () => { + + before((client, done) => { + browser + .waitForElementPresent('textarea.inputMessage', 5000) + .clearValue('textarea.inputMessage') + .setValue('textarea.inputMessage', ['/me is no stranger to love', browser.Keys.RETURN]) + .waitForElementVisible('.action span.messageBody', 5000, () => { done(); }); }); + + it('Should express an interactive action', () => { + browser.assert.containsText('.action span.messageBody', 'is no stranger to love'); + }); + }); - it('Should send a message', () => { - browser.windowHandles((result) => { - browser.switchWindow(result.value[0], () => { - browser.waitForElementPresent('span.messageBody', 5000, () => { - browser.pause(2000); - browser.assert.containsText('span.messageBody', 'Hello world!'); - }); + describe('/nick', () => { + + before((client, done) => { + browser + .waitForElementPresent('textarea.inputMessage', 5000) + .clearValue('textarea.inputMessage') + .setValue('textarea.inputMessage', ['/nick rickAnsley', browser.Keys.RETURN]) + .waitForElementVisible('.change-username-warning', 5000) + .clearValue('textarea.inputMessage') + .setValue('textarea.inputMessage', ['/nick rickAnsley', browser.Keys.RETURN]) + .waitForElementVisible('.log.changed-name', 5000, () => { + done(); }); }); + + it('Should change username', () => { + browser.assert.containsText('.log.changed-name', 'rickAnsley'); + }); + }); }); - }); - - describe('Slash Commands', () => { - - before((client, done) => { - let url = 'http://localhost:3000/' + testingRoom; - browser.url(url, () => { - browser.windowHandles((result) => { - browser.switchWindow(result.value[0], () => { - browser.execute((id) => { - window.open('http://localhost:3000/' + id, '_self'); - }, [testingRoom], () => { - done(); - }); - }); - }); - }); - }); - - describe('/me', () => { + describe('Before file transfer: Image: Confirm sending', () => { before((client, done) => { - browser.windowHandles((result) => { - browser.switchWindow(result.value[0], () => { - browser.waitForElementPresent('ul.users li:nth-child(2)', 5000, () => { - browser.setValue('textarea.inputMessage', ['/me is no stranger to love', browser.Keys.RETURN], () => { + browser.waitForElementPresent('#send-file', 5000, () => { + browser.execute(() => { + $('input[name="fileUploader"]').show(); + }, [], () => { + browser.waitForElementPresent('input[name="fileUploader"]', 5000, () => { + let testFile = __dirname + '/ricky.jpg'; + browser.setValue('input[name="fileUploader"]', testFile, (result) => { done(); }); }); @@ -122,101 +152,21 @@ describe('Darkwire', () => { }); }); - it('Should express an interactive action', () => { - browser.windowHandles((result) => { - browser.switchWindow(result.value[0], () => { - browser.waitForElementPresent('span.messageBody', 5000, () => { - browser.pause(5000); - browser.assert.containsText('.action span.messageBody', 'is no stranger to love'); - }); - }); - }); + it('Should prompt user confirmation', () => { + browser + .waitForElementVisible('span.messageBody .file-presend-prompt', 5000) + .assert.containsText('span.messageBody .file-presend-prompt', 'You are about to send ricky.jpg to all participants in this chat. Confirm | Cancel'); + }); + + it('Should show sent confirmation message', () => { + browser + .waitForElementVisible('a.file-trigger-confirm', 5000) + .click('a.file-trigger-confirm') + .waitForElementNotPresent('a.file-trigger-confirm', 5000) + .assert.containsText('.message .file-presend-prompt', 'Sent ricky.jpg'); }); }); - - describe('/nick', () => { - - before((client, done) => { - browser.url('http://localhost:3000/' + testingRoom, () => { - browser.waitForElementPresent('ul.users li:nth-child(2)', 5000, () => { - browser.setValue('textarea.inputMessage', ['/nick rickAnsley', browser.Keys.RETURN], () => { - browser.waitForElementPresent('.log:last-child', 5000, () => { - browser.setValue('textarea.inputMessage', ['/nick rickAnsley', browser.Keys.RETURN], () => { - done(); - }); - }); - }); - }); - }); - }); - - it('Should change username', () => { - browser.windowHandles((result) => { - browser.switchWindow(result.value[3], () => { - browser.pause(5000); - browser.assert.containsText('.log:last-child', 'rickAnsley'); - }); - }); - }); - - }); - - }); - - describe('Before file transfer: Image: Confirm sending', () => { - - before((client, done) => { - let url = 'http://localhost:3000/' + testingRoom; - browser.url(url, () => { - browser.windowHandles((result) => { - browser.switchWindow(result.value[0], () => { - browser.execute((id) => { - window.open('http://localhost:3000/' + id, '_self'); - }, [testingRoom], () => { - browser.waitForElementPresent('#send-file', 5000, () => { - browser.execute(() => { - $('input[name="fileUploader"]').show(); - }, [], () => { - browser.waitForElementPresent('input[name="fileUploader"]', 5000, () => { - let testFile = __dirname + '/ricky.jpg'; - browser.setValue('input[name="fileUploader"]', testFile, (result) => { - done(); - }); - }); - }); - }); - }); - }); - }); - }); - }); - - it('Should prompt user confirmation', () => { - browser.windowHandles((result) => { - browser.switchWindow(result.value[0], () => { - browser.waitForElementPresent('span.messageBody', 5000, () => { - browser.pause(5000); - browser.assert.containsText('span.messageBody', 'You are about to send ricky.jpg to all participants in this chat. Confirm | Cancel'); - }); - }); - }); - }); - - it('Should show sent confirmation message', () => { - browser.windowHandles((result) => { - browser.switchWindow(result.value[0], () => { - browser.waitForElementPresent('a.file-trigger-confirm', 5000, () => { - browser.click('a.file-trigger-confirm', () => { - browser.waitForElementNotPresent('a.file-trigger-confirm', 5000, () => { - browser.assert.containsText('span.messageBody', 'Sent ricky.jpg'); - }); - }); - }); - }); - }); - }); - }); }); diff --git a/test/acceptance/fileUtility.js b/test/acceptance/fileUtility.js deleted file mode 100644 index 2a8371a..0000000 --- a/test/acceptance/fileUtility.js +++ /dev/null @@ -1 +0,0 @@ -($('#fileInput').show)();