From 23e20abf6c50590fd516074b987522ef687e9c36 Mon Sep 17 00:00:00 2001 From: Sergio Crisostomo Date: Sun, 1 Oct 2017 00:09:30 +0200 Subject: [PATCH] DRY message/index.js and add unit tests --- src/components/message/index.js | 61 +++++++++++-------------------- test/unit/specs/message.spec.js | 64 +++++++++++++++++++++++++++++++++ 2 files changed, 85 insertions(+), 40 deletions(-) create mode 100644 test/unit/specs/message.spec.js diff --git a/src/components/message/index.js b/src/components/message/index.js index d7592bcb..563a527c 100644 --- a/src/components/message/index.js +++ b/src/components/message/index.js @@ -4,8 +4,11 @@ const prefixCls = 'ivu-message'; const iconPrefixCls = 'ivu-icon'; const prefixKey = 'ivu_message_key_'; -let defaultDuration = 1.5; -let top; +const defaults = { + top: 24, + duration: 1.5 +}; + let messageInstance; let name = 1; @@ -21,14 +24,14 @@ function getMessageInstance () { messageInstance = messageInstance || Notification.newInstance({ prefixCls: prefixCls, styles: { - top: `${top}px` + top: `${defaults.top}px` } }); return messageInstance; } -function notice (content = '', duration = defaultDuration, type, onClose = function () {}, closable = false) { +function notice (content = '', duration = defaults.duration, type, onClose = function () {}, closable = false) { const iconType = iconTypes[type]; // if loading @@ -66,56 +69,34 @@ export default { name: 'Message', info (options) { - const type = typeof options; - if (type === 'string') { - options = { - content: options - }; - } - return notice(options.content, options.duration, 'info', options.onClose, options.closable); + return this.message('info', options); }, success (options) { - const type = typeof options; - if (type === 'string') { - options = { - content: options - }; - } - return notice(options.content, options.duration, 'success', options.onClose, options.closable); + return this.message('success', options); }, warning (options) { - const type = typeof options; - if (type === 'string') { - options = { - content: options - }; - } - return notice(options.content, options.duration, 'warning', options.onClose, options.closable); + return this.message('warning', options); }, error (options) { - const type = typeof options; - if (type === 'string') { - options = { - content: options - }; - } - return notice(options.content, options.duration, 'error', options.onClose, options.closable); + return this.message('error', options); }, loading (options) { - const type = typeof options; - if (type === 'string') { + return this.message('loading', options); + }, + message(type, options){ + if (typeof options === 'string') { options = { content: options }; } - return notice(options.content, options.duration, 'loading', options.onClose, options.closable); + return notice(options.content, options.duration, type, options.onClose, options.closable); }, config (options) { - if (options.top) { - top = options.top; + if (options.top || options.top === 0) { + defaults.top = options.top; } - if (options.duration) { - defaultDuration = options.duration; + if (options.duration || options.duration === 0) { + defaults.duration = options.duration; } }, destroy () { @@ -123,4 +104,4 @@ export default { messageInstance = null; instance.destroy('ivu-message'); } -}; \ No newline at end of file +}; diff --git a/test/unit/specs/message.spec.js b/test/unit/specs/message.spec.js new file mode 100644 index 00000000..bbf6eda5 --- /dev/null +++ b/test/unit/specs/message.spec.js @@ -0,0 +1,64 @@ +import {createVue, destroyVM, waitForIt} from '../util'; + +describe('Message.vue', () => { + let vm; + afterEach(() => { + destroyVM(vm); + }); + + it('should open a info message by default', done => { + vm = createVue({render: () => {}}); + const testMessage = 'Hello world!'; + let messageContainer = null; + vm.$Message.info({ + content: testMessage, + duration: 200 // too long so we can test + }); + + const selector = '.ivu-message-notice-content-text .ivu-message-info'; + const checkMessageOpens = () => (messageContainer = document.querySelector(selector)); + + waitForIt(checkMessageOpens, function() { + expect(messageContainer.textContent.trim()).to.equal(testMessage); + messageContainer.parentElement.removeChild(messageContainer); + done(); + }); + }); + + it('should open specific messages of different types', function(done) { + vm = createVue({render: () => {}}); + const testMessage = type => `Hello world! this is a ${type} message`; + const tests = ['info', 'success', 'warning', 'error', 'loading'].reduce((tests, type) => { + return tests.concat({ + type: type, + message: testMessage(type), + class: 'ivu-message-' + type + }); + }, []); + let domElements = []; + + for (const {type, message} of tests) { + vm.$Message[type]({ + content: message, + duration: 10 // long so we can test + }); + } + + const checkAllMessageOpens = () => { + domElements = document.querySelectorAll('.ivu-message-custom-content'); + return domElements.length == tests.length && domElements; + }; + + waitForIt(checkAllMessageOpens, function() { + const verify = {}; + domElements.forEach(el => { + const message = el.textContent.trim(); + const test = tests.find(test => test.message == message); + verify[test.type] = true; + expect(el.classList.contains(test.class)).to.equal(true); + }); + expect(Object.keys(verify).length).to.equal(tests.length); + done(); + }); + }); +});