mock-echo

Mocking framework for Laravel Echo

Installation

npm i mock-echo

Usage

Import mock-echo import MockEcho from 'mock-echo'

Replace global object Echo with new MockEcho() before every unit test

let mockEcho

beforeEach(() => {
    mockEcho = new MockEcho()
    global.Echo = mockEcho
})

Remember to delete global object Echo after every unit test

afterEach(() => {
    delete global.Echo
})

Determine whether channel has been listened

You can use channelExist, privateChannelExist or presenceChannelExist to determine whether channel has been listened:

• channelExist: channel
• privateChannelExist: private channel
• presenceChannelExist: presence channel

Example:

expect(mockEcho.channelExist('news')).toBe(true)
expect(mockEcho.privateChannelExist('meeting')).toBe(true)
expect(mockEcho.presenceChannelExist('chat')).toBe(true)

All examples are using expect as assertion library

Get mock channel object

You can use getChannel, getPrivateChannel, getPresenceChannel to get mock channel object

• getChannel: channel
• getPrivateChannel: private channel
• getPresenceChannel: presence channel

Mock channel object has functions eventExist, broadcast, etc.

Example:

expect(mockEcho.getChannel('news').eventExist('NewsMessage')).toBe(true)

Determine whether event has been listened

You can use getChannel(channelName).eventExist, getPrivateChannel(channelName).eventExist or getPresenceChannel(channelName).eventExist to determine whether event has been listened:

• getChannel(channelName).eventExist: channel
• getPrivateChannel(channelName).eventExist: private channel
• getPresenceChannel(channelName).eventExist: presence channel

Example:

expect(mockEcho.getChannel('news').eventExist('NewsMessage')).toBe(true)
expect(mockEcho.getPrivateChannel('meeting').eventExist('MeetingMessage')).toBe(true)
expect(mockEcho.getPresenceChannel('chat').eventExist('ChatMessage')).toBe(true)

Broadcast event

You can use broadcast to broadcast an event.

Note: If you are using vue-test-utils, call $nextTick before assertion.

Example:

mockEcho.getChannel('news').broadcast('NewsMessage', { message: 'Hello World' })
wrapper.vm.$nextTick(() => {
    expect(wrapper.find('.message').text()).toBe('It said Hello World')
    done()
})

Presence channel actions

You can use iJoin, userJoin, userLeave to trigger presence channel actions:

• iJoin: trigger here listener
• userJoin: trigger joining listner. It will return subId after calling userJoin. You can use this subId to get this user away from this channel.
• userLeave: trigger leaving listner. Use subId which got from userJoin to get this user away from this channel.

Note: If you are using vue-test-utils, call $nextTick before assertion.

Example:

mockEcho.getPresenceChannel('chat').iJoin({id: 1, name: 'Alex'})
wrapper.vm.$nextTick(() => {
    expect(wrapper.find('.here-message').text()).toBe('There are 1 users')
    done()
})

// You will need paulSubId to get this user away from this channel
let paulSubId = mockEcho.getPresenceChannel('chat').userJoin({id: 2, name: 'Paul'})
wrapper.vm.$nextTick(() => {
    expect(wrapper.find('.join-message').text()).toBe('Paul joined')
    done()
})

mockEcho.getPresenceChannel('chat').userLeave(paulSubId)
wrapper.vm.$nextTick(() => {
    expect(wrapper.find('.leave-message').text()).toBe('Paul leaved')
    done()
})

Client events

You can use whisper to send user event. Only private channel object and presence channel object have whisper.

Note: If you are using vue-test-utils, call $nextTick before assertion.

Example:

// private channel
mockEcho.getPrivateChannel('meeting').whisper('meetingClicking', { username: username })
wrapper.vm.$nextTick(() => {
    expect(wrapper.find('.whisper-message').text()).toBe(`${username} is clicking the button`)
    done()
})

// presence channel
mockEcho.getPresenceChannel('chat').whisper('chatClicking', { username: username })
wrapper.vm.$nextTick(() => {
    expect(wrapper.find('.whisper-message').text()).toBe(`${username} is clicking the button`)
    done()
})

If you found any bugs

Please create the issue

可以用中文