464 lines
14 KiB
JavaScript
464 lines
14 KiB
JavaScript
/// <reference types="cypress" />
|
|
|
|
import makeFakeSession from '../../factories/session';
|
|
import makeFakeUser from '../../factories/user';
|
|
import { faker } from '@faker-js/faker';
|
|
|
|
describe('Browse sessions', () => {
|
|
const currentUser = makeFakeUser();
|
|
beforeEach(() => {
|
|
cy.stubAuthenticate({ id: currentUser.id });
|
|
});
|
|
|
|
describe('when there are no active sessions', () => {
|
|
beforeEach(() => {
|
|
cy.intercept('GET', /\S+\/api\/sessions/, {
|
|
body: []
|
|
});
|
|
cy.visit('/sessions');
|
|
});
|
|
|
|
it('alerts when there is no records', () => {
|
|
cy.contains('There are no public, open sessions currently available for you to join');
|
|
cy.contains('create a session').click();
|
|
cy.url().should('include', '/sessions/new');
|
|
});
|
|
});
|
|
|
|
describe('when there are active sessions', () => {
|
|
describe('in desktop', () => {
|
|
beforeEach(() => {
|
|
cy.viewport('macbook-15');
|
|
});
|
|
|
|
it('lists the sessions', () => {
|
|
const session = makeFakeSession({
|
|
participants: [
|
|
{
|
|
user: {
|
|
name: 'John Doe'
|
|
},
|
|
tracks: [
|
|
{
|
|
id: '1',
|
|
instrument: 'Guitar'
|
|
}
|
|
]
|
|
},
|
|
{
|
|
user: {
|
|
name: 'Ray Charles'
|
|
},
|
|
tracks: [
|
|
{
|
|
id: '2',
|
|
instrument: 'Bass'
|
|
}
|
|
]
|
|
}
|
|
]
|
|
});
|
|
cy.intercept('GET', /\S+\/api\/sessions/, [session]);
|
|
cy.visit('/sessions');
|
|
cy.get('[data-testid=sessionsListTable] tbody tr').should('have.length', 1);
|
|
});
|
|
|
|
describe('session description', () => {
|
|
it('when user has provided a description', () => {
|
|
const session = makeFakeSession({
|
|
description: 'custom description',
|
|
participants: [
|
|
{
|
|
user: {
|
|
name: 'John Doe'
|
|
},
|
|
tracks: [
|
|
{
|
|
id: '1',
|
|
instrument: 'Guitar'
|
|
}
|
|
]
|
|
},
|
|
{
|
|
user: {
|
|
name: 'Ray Charles'
|
|
},
|
|
tracks: [
|
|
{
|
|
id: '2',
|
|
instrument: 'Bass'
|
|
}
|
|
]
|
|
}
|
|
]
|
|
});
|
|
cy.intercept('GET', /\S+\/api\/sessions/, [session]);
|
|
cy.visit('/sessions');
|
|
cy.get('[data-testid=sessionsListTable] tbody tr').contains('custom description');
|
|
});
|
|
|
|
it('when user has not provided a description and session is public', () => {
|
|
const session = makeFakeSession({
|
|
description: null,
|
|
musician_access: true,
|
|
approval_required: false,
|
|
participants: [
|
|
{
|
|
user: {
|
|
name: 'John Doe'
|
|
},
|
|
tracks: [
|
|
{
|
|
id: '1',
|
|
instrument: 'Guitar'
|
|
}
|
|
]
|
|
},
|
|
{
|
|
user: {
|
|
name: 'Ray Charles'
|
|
},
|
|
tracks: [
|
|
{
|
|
id: '2',
|
|
instrument: 'Bass'
|
|
}
|
|
]
|
|
}
|
|
]
|
|
});
|
|
cy.intercept('GET', /\S+\/api\/sessions/, [session]);
|
|
cy.visit('/sessions');
|
|
cy.get('[data-testid=sessionsListTable] tbody tr').contains('Public, open session. Feel free to join!');
|
|
});
|
|
|
|
it('when user has not provided a description and session is private and requires approval to join', () => {
|
|
const session = makeFakeSession({
|
|
description: null,
|
|
musician_access: true,
|
|
approval_required: true,
|
|
participants: [
|
|
{
|
|
user: {
|
|
name: 'John Doe'
|
|
},
|
|
tracks: [
|
|
{
|
|
id: '1',
|
|
instrument: 'Guitar'
|
|
}
|
|
]
|
|
},
|
|
{
|
|
user: {
|
|
name: 'Ray Charles'
|
|
},
|
|
tracks: [
|
|
{
|
|
id: '2',
|
|
instrument: 'Bass'
|
|
}
|
|
]
|
|
}
|
|
]
|
|
});
|
|
cy.intercept('GET', /\S+\/api\/sessions/, [session]);
|
|
cy.visit('/sessions');
|
|
cy.get('[data-testid=sessionsListTable] tbody tr').contains(
|
|
'Private session. Click the enter button in the right column to request to join'
|
|
);
|
|
});
|
|
|
|
it('when user has not provided a description and session is RSVP', () => {
|
|
const session = makeFakeSession({
|
|
description: null,
|
|
musician_access: false,
|
|
approval_required: false,
|
|
participants: [
|
|
{
|
|
user: {
|
|
name: 'John Doe'
|
|
},
|
|
tracks: [
|
|
{
|
|
id: '1',
|
|
instrument: 'Guitar'
|
|
}
|
|
]
|
|
},
|
|
{
|
|
user: {
|
|
name: 'Ray Charles'
|
|
},
|
|
tracks: [
|
|
{
|
|
id: '2',
|
|
instrument: 'Bass'
|
|
}
|
|
]
|
|
}
|
|
]
|
|
});
|
|
cy.intercept('GET', /\S+\/api\/sessions/, [session]);
|
|
cy.visit('/sessions');
|
|
cy.get('[data-testid=sessionsListTable] tbody tr').contains('Only RSVP musicians may join');
|
|
});
|
|
});
|
|
|
|
describe('invitation', () => {
|
|
it('shows invite detail if the user has been invited', () => {
|
|
const session = makeFakeSession({
|
|
invitations: [
|
|
{
|
|
sender_id: '1',
|
|
receiver_id: currentUser.id
|
|
}
|
|
],
|
|
participants: [
|
|
{
|
|
user: {
|
|
name: 'John Doe'
|
|
},
|
|
tracks: [
|
|
{
|
|
id: '1',
|
|
instrument: 'Guitar'
|
|
}
|
|
]
|
|
},
|
|
{
|
|
user: {
|
|
name: 'Ray Charles'
|
|
},
|
|
tracks: [
|
|
{
|
|
id: '2',
|
|
instrument: 'Bass'
|
|
}
|
|
]
|
|
}
|
|
]
|
|
});
|
|
cy.intercept('GET', /\S+\/api\/sessions/, [session]);
|
|
cy.visit('/sessions');
|
|
cy.get('[data-testid=sessionsListTable] tbody tr').contains('YOU WERE INVITED TO THIS SESSION');
|
|
});
|
|
});
|
|
|
|
describe('friend info', () => {
|
|
it('shows if there is a friend in session', () => {
|
|
const session = makeFakeSession({
|
|
participants: [
|
|
{
|
|
user: {
|
|
is_friend: true,
|
|
name: faker.person.fullName()
|
|
},
|
|
tracks: [
|
|
{
|
|
id: '1',
|
|
instrument: 'Guitar'
|
|
}
|
|
]
|
|
}
|
|
]
|
|
});
|
|
console.log('_DEBUG_ session', session);
|
|
cy.intercept('GET', /\S+\/api\/sessions/, [session]);
|
|
cy.visit('/sessions');
|
|
cy.get('[data-testid=sessionsListTable] tbody tr').contains('YOU HAVE A FRIEND IN THIS SESSION');
|
|
});
|
|
});
|
|
|
|
describe('participants', () => {
|
|
it('shows the participants', () => {
|
|
const session = makeFakeSession({
|
|
participants: [
|
|
{
|
|
user: {
|
|
name: 'John Doe'
|
|
},
|
|
tracks: [
|
|
{
|
|
id: '1',
|
|
instrument: 'Guitar'
|
|
}
|
|
]
|
|
},
|
|
{
|
|
user: {
|
|
name: 'Ray Charles'
|
|
},
|
|
tracks: [
|
|
{
|
|
id: '2',
|
|
instrument: 'Bass'
|
|
}
|
|
]
|
|
}
|
|
]
|
|
});
|
|
cy.intercept('GET', /\S+\/api\/sessions/, [session]);
|
|
cy.visit('/sessions');
|
|
cy.get('[data-testid=sessionsListTable] tbody tr').contains('John Doe');
|
|
cy.get('[data-testid=sessionsListTable] tbody tr').contains('Ray Charles');
|
|
});
|
|
});
|
|
|
|
describe('instruments', () => {
|
|
it('shows the instruments', () => {
|
|
const session = makeFakeSession({
|
|
participants: [
|
|
{
|
|
id: 'p1',
|
|
user: {
|
|
name: 'John Doe'
|
|
},
|
|
tracks: [
|
|
{
|
|
id: '1',
|
|
instrument: 'Electric Guitar',
|
|
instrument_id: 'electric_guitar'
|
|
},
|
|
{
|
|
id: '2',
|
|
instrument: 'Drums',
|
|
instrument_id: 'drums'
|
|
}
|
|
]
|
|
},
|
|
{
|
|
id: 'p2',
|
|
user: {
|
|
name: 'Ray Charles'
|
|
},
|
|
tracks: [
|
|
{
|
|
id: '2',
|
|
instrument: 'Bass Guitar',
|
|
instrument_id: 'bass_guitar'
|
|
}
|
|
]
|
|
}
|
|
]
|
|
});
|
|
cy.intercept('GET', /\S+\/api\/sessions/, [session]);
|
|
cy.visit('/sessions');
|
|
cy.get('[data-testid=sessionsListTable] tbody tr')
|
|
.find(`[data-testid=Participantp1Tracks]`).trigger('mouseover')
|
|
//cy.contains('Electric Guitar');
|
|
// cy.get('[data-testid=sessionsListTable] tbody tr')
|
|
// .find(`[data-testid=Participantp1Tracks]`)
|
|
// .contains('Drums');
|
|
// cy.get('[data-testid=sessionsListTable] tbody tr')
|
|
// .find(`[data-testid=Participantp2Tracks]`)
|
|
// .contains('Bass');
|
|
});
|
|
});
|
|
|
|
describe('click join button - on a private session', () => {
|
|
it('shows toast message', () => {
|
|
const session = makeFakeSession({
|
|
participants: [
|
|
{
|
|
user: {
|
|
id: '1',
|
|
name: 'John Doe'
|
|
},
|
|
tracks: [
|
|
{
|
|
id: '1',
|
|
instrument: 'Guitar'
|
|
}
|
|
]
|
|
}
|
|
],
|
|
musician_access: true,
|
|
approval_required: true
|
|
});
|
|
cy.intercept('GET', /\S+\/api\/sessions/, [session]);
|
|
cy.intercept('GET', /\S+\/api\/users\/\S+\/latencies\?\S+/, { users: [{
|
|
user_id: currentUser.id,
|
|
first_name:"John",
|
|
last_name:"Doe",
|
|
audio_latency:5,
|
|
audio_latency_unknown:false,
|
|
}]});
|
|
|
|
cy.visit('/sessions');
|
|
cy.get('[data-testid=sessionsListTable] tbody tr')
|
|
.find('[data-testid=joinBtn]')
|
|
.click();
|
|
cy.contains('You have requested to join this private session.');
|
|
// cy.get('[data-testid=native-app-unavailable]').contains('Cancel').click();
|
|
});
|
|
});
|
|
|
|
describe('click join button - on a public session', () => {
|
|
it('opens native client', () => {
|
|
const session = makeFakeSession({
|
|
participants: [
|
|
{
|
|
user: {
|
|
id: '1',
|
|
name: 'John Doe'
|
|
},
|
|
tracks: [
|
|
{
|
|
id: '1',
|
|
instrument: 'Guitar'
|
|
}
|
|
]
|
|
}
|
|
],
|
|
musician_access: true,
|
|
approval_required: false
|
|
});
|
|
const newUrl = `jamkazam://url=http://www.jamkazam.local:3000/client#/findSession/custom~yes%7CjoinSessionId~${
|
|
session.id
|
|
}`;
|
|
cy.intercept('GET', /\S+\/api\/sessions/, [session]);
|
|
cy.intercept('GET', /\S+\/api\/users\/\S+\/latencies\?\S+/, { users: [{
|
|
user_id: currentUser.id,
|
|
first_name:"John",
|
|
last_name:"Doe",
|
|
audio_latency:5,
|
|
audio_latency_unknown:false,
|
|
}]});
|
|
cy.visit('/sessions').then(win => {
|
|
cy.stub(win, 'open').as('windowOpen');
|
|
});
|
|
// cy.get('[data-testid=sessionsListTable] tbody tr')
|
|
// .find('[data-testid=joinBtn]')
|
|
// .click();
|
|
//cy.get('@windowOpen').should('have.been.calledWith', newUrl);
|
|
});
|
|
});
|
|
});
|
|
|
|
describe.skip('in mobile', () => {
|
|
beforeEach(() => {
|
|
cy.viewport('iphone-6');
|
|
});
|
|
|
|
describe('pagination', () => {
|
|
it('shows the next page of sessions', () => {
|
|
const sessions = [];
|
|
for (let i = 0; i < 5; i++) {
|
|
sessions.push(makeFakeSession({ id: faker.string.uuid() }));
|
|
}
|
|
cy.intercept('GET', /\S+\/api\/sessions/, sessions);
|
|
cy.visit('/sessions');
|
|
cy.get('[data-testid=sessionsSwiper] .swiper-button-prev').should('have.class', 'swiper-button-disabled');
|
|
for (let i = 0; i < 4; i++) {
|
|
// 4 because the first one is already visible
|
|
cy.get('[data-testid=sessionsSwiper] .swiper-button-next').click();
|
|
cy.wait(500);
|
|
}
|
|
cy.get('[data-testid=sessionsSwiper] .swiper-button-next').should('have.class', 'swiper-button-disabled');
|
|
});
|
|
});
|
|
});
|
|
});
|
|
});
|