Andal.LND/edx-platform
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Transcript file upload - EDUCATOR-2029

Browse Source
This commit is contained in:
Mushtaq Ali
2017-12-29 18:02:33 +05:00
parent 4f422e37d9
commit 00a86ccef8
5 changed files with 385 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

187
cms/static/js/spec/views/video_transcripts_spec.js
View File

@@ -1,12 +1,15 @@
define(
['jquery', 'underscore', 'backbone', 'js/views/video_transcripts', 'js/views/previous_video_upload_list',
'common/js/spec_helpers/template_helpers'],
function($, _, Backbone, VideoTranscriptsView, PreviousVideoUploadListView, TemplateHelpers) {
'edx-ui-toolkit/js/utils/spec-helpers/ajax-helpers', 'common/js/spec_helpers/template_helpers'],
function($, _, Backbone, VideoTranscriptsView, PreviousVideoUploadListView, AjaxHelpers, TemplateHelpers) {
'use strict';
describe('VideoTranscriptsView', function() {
var videoTranscriptsView,
renderView,
verifyTranscriptActions,
verifyTranscriptStateInfo,
verifyMessage,
verifyDetailedErrorMessage,
createFakeTranscriptFile,
transcripts = {
en: 'English',
es: 'Spanish',
@@ -23,17 +26,28 @@ define(
},
TRANSCRIPT_DOWNLOAD_FILE_FORMAT = 'srt',
TRANSCRIPT_DOWNLOAD_URL = 'abc.com/transcript_download/course_id',
TRANSCRIPT_UPLOAD_URL = 'abc.com/transcript_upload/course_id',
videoSupportedFileFormats = ['.mov', '.mp4'],
videoTranscriptSettings = {
trancript_download_file_format: TRANSCRIPT_DOWNLOAD_FILE_FORMAT,
transcript_download_handler_url: TRANSCRIPT_DOWNLOAD_URL
transcript_download_handler_url: TRANSCRIPT_DOWNLOAD_URL,
transcript_upload_handler_url: TRANSCRIPT_UPLOAD_URL
},
videoListView;
verifyTranscriptActions = function($transcriptActionsEl, transcriptLanguage) {
var downloadTranscriptActionEl = $transcriptActionsEl.find('.download-transcript-button'),
verifyTranscriptStateInfo = function($transcriptEl, transcriptLanguage) {
var $transcriptActionsEl = $transcriptEl.find('.transcript-actions'),
downloadTranscriptActionEl = $transcriptActionsEl.find('.download-transcript-button'),
uploadTranscriptActionEl = $transcriptActionsEl.find('.upload-transcript-button');
// Verify transcript data attributes
expect($transcriptEl.data('edx-video-id')).toEqual(edxVideoID);
expect($transcriptEl.data('language-code')).toEqual(transcriptLanguage);
// Verify transcript language dropdown has correct value set.
expect($transcriptEl.find('.transcript-language-menu').val(), transcriptLanguage);
// Verify transcript actions
expect(downloadTranscriptActionEl.html().trim(), 'Download');
expect(
downloadTranscriptActionEl.attr('href'),
@@ -41,8 +55,33 @@ define(
);
expect(uploadTranscriptActionEl.html().trim(), 'Upload');
expect(uploadTranscriptActionEl.data('edx-video-id'), edxVideoID);
expect(uploadTranscriptActionEl.data('language-code'), transcriptLanguage);
};
verifyMessage = function($transcriptEl, status) {
var $transcriptStatusEl = $transcriptEl.find('.transcript-upload-status-container'),
statusData = videoTranscriptsView.transcriptUploadStatuses[status];
expect($transcriptStatusEl.hasClass(statusData.statusClass)).toEqual(true);
expect($transcriptStatusEl.find('span.fa').hasClass(statusData.iconClasses)).toEqual(true);
expect(
$transcriptStatusEl.find('.more-details-action').hasClass('hidden')
).toEqual(statusData.hiddenClass === 'hidden');
expect(
$transcriptStatusEl.find('.transcript-detail-status').html().trim()
).toEqual(statusData.shortMessage);
};
verifyDetailedErrorMessage = function($transcriptEl, expectedTitle, expectedMessage) {
$transcriptEl.find('.more-details-action').click();
expect($('#prompt-warning-title').text().trim()).toEqual(expectedTitle);
expect($('#prompt-warning-description').text().trim()).toEqual(expectedMessage);
};
createFakeTranscriptFile = function(transcriptFileName) {
var transcriptFileName = transcriptFileName || 'test-transcript.srt', // eslint-disable-line no-redeclare, max-len
size = 100,
type = '';
return new File([new Blob([Array(size).join('i')], {type: type})], transcriptFileName);
};
renderView = function(availableTranscripts, isVideoTranscriptEnabled) {
@@ -71,7 +110,10 @@ define(
};
beforeEach(function() {
setFixtures('<section class="wrapper-assets"></section>');
setFixtures(
'<div id="page-prompt"></div>' +
'<section class="wrapper-assets"></section>'
);
TemplateHelpers.installTemplate('previous-video-upload-list');
renderView(transcripts);
});
@@ -177,18 +219,133 @@ define(
);
_.each(transcripts, function(langaugeText, languageCode) {
$transcriptEl = $(videoTranscriptsView.$el.find('#show-video-transcript-content-' + languageCode));
$transcriptEl = videoTranscriptsView.$el.find('.show-video-transcript-content[data-language-code="' + languageCode + '"]'); // eslint-disable-line max-len
// Verify correct transcript title is set.
expect($transcriptEl.find('.transcript-title').html()).toEqual(
'Video client title n_' + languageCode + '.' + TRANSCRIPT_DOWNLOAD_FILE_FORMAT
);
// Verify transcript language dropdown has correct value set.
expect($transcriptEl.find('.transcript-language-menu').val(), languageCode);
// Verify transcript actions are rendered correctly.
verifyTranscriptActions($transcriptEl.find('.transcript-actions'), languageCode);
// Verify transcript is rendered with correct info.
verifyTranscriptStateInfo($transcriptEl, languageCode);
});
});
it('can upload transcript', function() {
var languageCode = 'en',
newLanguageCode = 'ar',
requests = AjaxHelpers.requests(this),
$transcriptEl = videoTranscriptsView.$el.find('.show-video-transcript-content[data-language-code="' + languageCode + '"]'); // eslint-disable-line max-len
// Verify correct transcript title is set.
expect($transcriptEl.find('.transcript-title').html()).toEqual(
'Video client title n_' + languageCode + '.' + TRANSCRIPT_DOWNLOAD_FILE_FORMAT
);
// Select a language
$transcriptEl.find('.transcript-language-menu').val(newLanguageCode);
$transcriptEl.find('.upload-transcript-button').click();
// Add transcript to upload queue and send POST request to upload transcript.
$transcriptEl.find('.upload-transcript-input').fileupload('add', {files: [createFakeTranscriptFile()]});
// Verify if POST request received for image upload
AjaxHelpers.expectRequest(
requests,
'POST',
TRANSCRIPT_UPLOAD_URL
);
// Send successful upload response
AjaxHelpers.respondWithJson(requests, {});
// Verify correct transcript title is set.
expect($transcriptEl.find('.transcript-title').html()).toEqual(
'Video client title n_' + newLanguageCode + '.' + TRANSCRIPT_DOWNLOAD_FILE_FORMAT
);
verifyMessage($transcriptEl, 'uploaded');
// Verify transcript is rendered with correct info.
verifyTranscriptStateInfo($transcriptEl, newLanguageCode);
});
it('shows error state correctly', function() {
var languageCode = 'en',
requests = AjaxHelpers.requests(this),
errorMessage = 'Transcript failed error message',
$transcriptEl = videoTranscriptsView.$el.find('.show-video-transcript-content[data-language-code="' + languageCode + '"]'); // eslint-disable-line max-len
$transcriptEl.find('.upload-transcript-button').click();
// Add transcript to upload queue and send POST request to upload transcript.
$transcriptEl.find('.upload-transcript-input').fileupload('add', {files: [createFakeTranscriptFile()]});
// Server response with bad request.
AjaxHelpers.respondWithError(requests, 400, {error: errorMessage});
verifyMessage($transcriptEl, 'failed');
// verify detailed error message
verifyDetailedErrorMessage(
$transcriptEl,
videoTranscriptsView.defaultFailureTitle,
errorMessage
);
// Verify transcript is rendered with correct info.
verifyTranscriptStateInfo($transcriptEl, languageCode);
});
it('should show error message in case of server error', function() {
var languageCode = 'en',
requests = AjaxHelpers.requests(this),
$transcriptEl = videoTranscriptsView.$el.find('.show-video-transcript-content[data-language-code="' + languageCode + '"]'); // eslint-disable-line max-len
$transcriptEl.find('.upload-transcript-button').click();
// Add transcript to upload queue and send POST request to upload transcript.
$transcriptEl.find('.upload-transcript-input').fileupload('add', {files: [createFakeTranscriptFile()]});
AjaxHelpers.respondWithError(requests, 500);
verifyMessage($transcriptEl, 'failed');
// verify detailed error message
verifyDetailedErrorMessage(
$transcriptEl,
videoTranscriptsView.defaultFailureTitle,
videoTranscriptsView.defaultFailureMessage
);
// Verify transcript is rendered with correct info.
verifyTranscriptStateInfo($transcriptEl, languageCode);
});
it('should show error message in case of unsupported transcript file format', function() {
var languageCode = 'en',
transcriptFileName = 'unsupported-transcript-file-format.txt',
errorMessage = transcriptFileName + ' is not in a supported file format. Supported file format is ' + TRANSCRIPT_DOWNLOAD_FILE_FORMAT + '.', // eslint-disable-line max-len
$transcriptEl = videoTranscriptsView.$el.find('.show-video-transcript-content[data-language-code="' + languageCode + '"]'); // eslint-disable-line max-len
$transcriptEl.find('.upload-transcript-button').click();
// Add transcript to upload queue and send POST request to upload transcript.
$transcriptEl.find('.upload-transcript-input').fileupload('add', {
files: [createFakeTranscriptFile(transcriptFileName)]
});
verifyMessage($transcriptEl, 'validationFailed');
// verify detailed error message
verifyDetailedErrorMessage(
$transcriptEl,
videoTranscriptsView.defaultFailureTitle,
errorMessage
);
// Verify transcript is rendered with correct info.
verifyTranscriptStateInfo($transcriptEl, languageCode);
});
});
}
);