test(video-player): Test that video player correcly plays HLS playlist

e2e/.gitignore

@@ -26,9 +26,7 @@ yarn-error.log*
 
 # Cypress
 cypress.env.json
-
 cypress/videos/**/*.mp4
-
 cypress/screenshots/**/*.png
-
-cypress/fixtures/upload-response.json
+cypress/fixtures/upload-response.json
+cypress/fixtures/playback-url.json

e2e/cypress/integration/01-upload.spec.js

@@ -5,7 +5,10 @@ describe('File upload', () => {
   it('Video.upload method', () => {
     cy.visit('/');
     const filepath = 'video/video-sample.mp4';
-    cy.get('input[type="file"]').attachFile(filepath);
+    cy.get('input[type="file"]').attachFile({
+      filePath: filepath,
+      encoding: 'binary',
+    });
     cy.get('[data-cy=submit]').click();
 
     cy.intercept('/graphql', (req) => {
@@ -28,7 +31,7 @@ describe('File upload', () => {
       expect(s3Put.response.statusCode).to.equal(200);
       cy.wait(1000);
       cy.get('[data-cy=pre-upload]')
-        .invoke('html')
+        .invoke('text')
         .then((response) => {
           cy.wrap(response).as('response');
         });
@@ -46,7 +49,7 @@ describe('File upload', () => {
 
     cy.wait(1000);
     cy.get('[data-cy=pre-upload]')
-      .invoke('html')
+      .invoke('text')
       .then((content) => {
         const { data } = JSON.parse(content);
         expect(data).to.have.ownProperty('createVideoObject');

e2e/cypress/integration/03-playback.spec.js

@@ -1,4 +1,4 @@
-import { RESPONSE_FILE_PATH } from '../utils/constant';
+import { RESPONSE_FILE_PATH, PLAYBACK_URL_FILE_PATH } from '../utils/constant';
 import { aliasMutation } from '../utils/graphql-test-utils';
 
 describe('Generate playback url', () => {
@@ -19,13 +19,13 @@ describe('Generate playback url', () => {
     cy.wait('@getVodAsset').then(() => {
       cy.wait(1000);
       cy.get('[data-cy=pre-playback]')
-        .invoke('html')
+        .invoke('text')
         .then((content) => {
           const { data } = JSON.parse(content);
           expect(data).to.not.equal(null);
-          expect(data).to.have.ownProperty('playbackUrl')
-          if (data.token)
-            expect(data.token).to.include("?Policy=ey")
+          expect(data).to.have.ownProperty('playbackUrl');
+          if (data.token) expect(data.token).to.include('?Policy=ey');
+          cy.writeFile(PLAYBACK_URL_FILE_PATH, JSON.parse(content));
         });
     });
   });
@@ -37,14 +37,14 @@ describe('Generate playback url', () => {
     cy.wait('@getVodAsset').then(() => {
       cy.wait(1000);
       cy.get('[data-cy=pre-playback]')
-        .invoke('html')
+        .invoke('text')
         .then((content) => {
           const { data } = JSON.parse(content);
           expect(data).to.not.equal(null);
           expect(data).to.have.ownProperty('playbackUrl');
           expect(data).to.have.ownProperty('error');
           expect(data.playbackUrl).to.equal(null);
-          expect(data.error).to.equal("Vod asset video ID not found");
+          expect(data.error).to.equal('Vod asset video ID not found');
         });
     });
   });

e2e/cypress/integration/04-video.spec.js

@@ -0,0 +1,23 @@
+import { PLAYBACK_URL_FILE_PATH } from '../utils/constant';
+import { aliasMutation } from '../utils/graphql-test-utils';
+
+describe('Generate playback url', () => {
+  beforeEach(() => {
+    /* cy.intercept('/graphql', (req) => {
+      aliasMutation(req, 'getVodAsset');
+    }); */
+  });
+
+  it('should generate playback url with token property if signed url', () => {
+    let id = null;
+    cy.visit('/');
+    cy.wait(12000); // WAIT FOR MEDIACONVERT JOB
+    cy.readFile(PLAYBACK_URL_FILE_PATH).then(({ data }) => {
+      cy.intercept(data.playbackUrl + data.token).as('HLS');
+      cy.get('[data-cy=video-url-input]').type(data.playbackUrl);
+      cy.get('[data-cy=video-token-input]').type(data.token);
+      cy.get('[data-cy=player]').click();
+      cy.wait('@HLS').its('response.statusCode').should('eq', 200)
+    });
+  });
+});

e2e/cypress/utils/constant.js

@@ -1 +1,2 @@
 export const RESPONSE_FILE_PATH = 'cypress/fixtures/upload-response.json';
+export const PLAYBACK_URL_FILE_PATH = 'cypress/fixtures/playback-url.json';