Skip to content

E
edx-platform
Commit f3b9ea43 by Mushtaq Ali
Options

Send transcript credentials data to backend 

Add Cielo Username

- EDUCATOR-1456
parent 6634b92c
Showing with 130 additions and 125 deletions
cms/static/js/spec/views/course_video_settings_spec.js
...@@ -11,14 +11,17 @@ define( ...@@ -11,14 +11,17 @@ define(
verifyTranscriptPreferences, verifyTranscriptPreferences,
verifyTranscriptPreferencesView, verifyTranscriptPreferencesView,
verifyOrganizationCredentialsView, verifyOrganizationCredentialsView,
verifyCredentialFieldsPresent,
verifyOrganizationCredentialField, verifyOrganizationCredentialField,
verifyMessage, verifyMessage,
verifyPreferanceErrorState, verifyPreferanceErrorState,
selectPreference, selectPreference,
verifyProviderList, verifyProviderList,
verifyProviderSelectedView, verifyProviderSelectedView,
verifyCredentialsSaved,
resetProvider, resetProvider,
changeProvider, changeProvider,
submitOrganizationCredentials,
transcriptPreferencesUrl = '/transcript_preferences/course-v1:edX+DemoX+Demo_Course', transcriptPreferencesUrl = '/transcript_preferences/course-v1:edX+DemoX+Demo_Course',
transcriptCredentialsHandlerUrl = '/transcript_credentials/course-v1:edX+DemoX+Demo_Course', transcriptCredentialsHandlerUrl = '/transcript_credentials/course-v1:edX+DemoX+Demo_Course',
activeTranscriptPreferences = { activeTranscriptPreferences = {
...@@ -198,6 +201,21 @@ define( ...@@ -198,6 +201,21 @@ define(
expect($courseVideoSettingsEl.find('.organization-credentials-content')).toExist(); expect($courseVideoSettingsEl.find('.organization-credentials-content')).toExist();
}; };
verifyCredentialFieldsPresent = function(fields) {
// Verify correct number of input fields are shown.
expect(
$courseVideoSettingsEl.find(
'.organization-credentials-wrapper .transcript-preferance-wrapper input'
).length
).toEqual(_.keys(fields).length
);
// Verify individual field has correct label and key.
_.each(fields, function(label, fieldName) {
verifyOrganizationCredentialField(fieldName, label);
});
};
verifyOrganizationCredentialField = function(fieldName, label) { verifyOrganizationCredentialField = function(fieldName, label) {
var elementSelector = courseVideoSettingsView.selectedProvider + '-' + fieldName; var elementSelector = courseVideoSettingsView.selectedProvider + '-' + fieldName;
// Verify that correct label is shown. // Verify that correct label is shown.
...@@ -211,6 +229,22 @@ define( ...@@ -211,6 +229,22 @@ define(
).toExist(); ).toExist();
}; };
verifyCredentialsSaved = function() {
// Verify that success message is shown.
verifyMessage(
'success',
transcriptionPlans[courseVideoSettingsView.selectedProvider].display_name + ' credentials saved'
);
// Also verify that transcript credential state is updated.
expect(
courseVideoSettingsView.transcriptOrganizationCredentials[courseVideoSettingsView.selectedProvider]
).toBeTruthy();
// Verify that selected provider view after credentials are saved.
verifyProviderSelectedView();
};
changeProvider = function(selectedProvider) { changeProvider = function(selectedProvider) {
// If Provider Selected view is show, first click on "Change Provider" button to // If Provider Selected view is show, first click on "Change Provider" button to
// show all list of providers. // show all list of providers.
...@@ -236,6 +270,42 @@ define( ...@@ -236,6 +270,42 @@ define(
AjaxHelpers.respondWithJson(requests, {}); AjaxHelpers.respondWithJson(requests, {});
}; };
submitOrganizationCredentials = function(fieldValues, errorMessage) {
var requests = AjaxHelpers.requests(this);
// Click change button to render organization credentials view.
$courseVideoSettingsEl.find('.action-change-provider').click();
// Provide organization credentials.
_.each(fieldValues, function(key) {
$courseVideoSettingsEl.find('.' + courseVideoSettingsView.selectedProvider + '-' + key).val(key);
});
// Click save organization credentials button to save credentials.
$courseVideoSettingsEl.find('.action-update-org-credentials').click();
AjaxHelpers.expectRequest(
requests,
'POST',
transcriptCredentialsHandlerUrl,
JSON.stringify(
_.extend(
{provider: courseVideoSettingsView.selectedProvider},
fieldValues,
{global: false}
)
)
);
if (errorMessage) {
// Send error response.
AjaxHelpers.respondWithError(requests, 400, {
error: errorMessage
});
} else {
// Send empty response.
AjaxHelpers.respondWithJson(requests, {});
}
};
beforeEach(function() { beforeEach(function() {
setFixtures( setFixtures(
'<div class="video-transcript-settings-wrapper"></div>' + '<div class="video-transcript-settings-wrapper"></div>' +
...@@ -570,30 +640,27 @@ define( ...@@ -570,30 +640,27 @@ define(
verifyOrganizationCredentialsView(); verifyOrganizationCredentialsView();
}); });
it('shows api secret input field if selected provider is 3Play Media', function() { it('shows cielo specific organization credentials fields only', function() {
// Set selected provider to 3Play Media verifyProviderSelectedView();
changeProvider('3PlayMedia');
// Click change button to render organization credentials view. // Click change button to render organization credentials view.
$courseVideoSettingsEl.find('.action-change-provider').click(); $courseVideoSettingsEl.find('.action-change-provider').click();
// Verify 3play api secret and api key are present. // Verify api key is present.
verifyOrganizationCredentialField('api-secret', 'API Secret'); verifyCredentialFieldsPresent({
verifyOrganizationCredentialField('api-key', 'API Key'); 'api-key': 'API Key',
username: 'Username'
});
}); });
it('does not show api secret input field if selected provider is not 3Play Media', function() { it('shows 3play specific organization credentials fields only', function() {
verifyProviderSelectedView(); // Set selected provider to 3Play Media
// Click change button to render organization credentials view. changeProvider('3PlayMedia');
$courseVideoSettingsEl.find('.action-change-provider').click();
// Verify 3Play Media api secret is not present.
expect(
$courseVideoSettingsEl.find('.' + courseVideoSettingsView.selectedProvider + '-api-secret')
).not.toExist();
// Verify api key is present. // Verify api key and api secret input fields are present.
verifyOrganizationCredentialField('api-key', 'API Key'); verifyCredentialFieldsPresent({
'api-key': 'API Key',
'api-secret': 'API Secret'
});
}); });
it('shows warning message when changing organization credentials if present already', function() { it('shows warning message when changing organization credentials if present already', function() {
...@@ -647,119 +714,40 @@ define( ...@@ -647,119 +714,40 @@ define(
); );
}); });
it('saves organization credentials on clicking save credentials button', function() { it('saves cielo organization credentials on clicking save credentials button', function() {
var requests = AjaxHelpers.requests(this);
verifyProviderSelectedView(); verifyProviderSelectedView();
// Click change button to render organization credentials view. submitOrganizationCredentials({
$courseVideoSettingsEl.find('.action-change-provider').click(); api_key: 'api-key',
username: 'username'
// Set organization credentials so as to pass validations. });
$courseVideoSettingsEl.find('.' + courseVideoSettingsView.selectedProvider + '-api-key').val('testkey');
// Click save organization credentials button to save credentials.
$courseVideoSettingsEl.find('.action-update-org-credentials').click();
AjaxHelpers.expectRequest(
requests,
'POST',
transcriptCredentialsHandlerUrl,
JSON.stringify({
provider: activeTranscriptPreferences.provider,
global: false
})
);
// Send empty response.
AjaxHelpers.respondWithJson(requests, {});
// Verify that success message is shown. verifyCredentialsSaved();
verifyMessage(
'success',
transcriptionPlans[courseVideoSettingsView.selectedProvider].display_name + ' credentials saved'
);
}); });
it('shows selected provider view afer organization credentials saved', function() { it('saves 3Play organization credentials on clicking save credentials button', function() {
var requests = AjaxHelpers.requests(this); verifyProviderSelectedView();
renderCourseVideoSettingsView(null, transcriptionPlans);
// Verify selected provider view is not shown.
expect(
$courseVideoSettingsEl.find('.transcript-provider-wrapper .selected-transcript-provider')
).not.toExist();
// Verify provider list view is shown.
verifyProviderList(providers.none);
// Check Cielo24 provider
changeProvider('Cielo24');
verifyProviderList(providers.Cielo24);
// Set organization credentials so as to pass validations.
$courseVideoSettingsEl.find('.' + courseVideoSettingsView.selectedProvider + '-api-key').val('testkey');
// Click save organization credentials button to save credentials.
$courseVideoSettingsEl.find('.action-update-org-credentials').click();
AjaxHelpers.expectRequest(
requests,
'POST',
transcriptCredentialsHandlerUrl,
JSON.stringify({
provider: activeTranscriptPreferences.provider,
global: false
})
);
// Send empty response.
AjaxHelpers.respondWithJson(requests, {});
// Verify that success message is shown. // Set selected provider to 3Play Media
verifyMessage( changeProvider('3PlayMedia');
'success',
transcriptionPlans[courseVideoSettingsView.selectedProvider].display_name + ' credentials saved'
);
// Shows selected provider view after credentials are saved. submitOrganizationCredentials({
verifyProviderSelectedView(); api_key: 'api-key',
api_secret_key: 'api-secret'
});
// Verify provider list view is not shown. verifyCredentialsSaved();
expect(
$courseVideoSettingsEl.find('.transcript-provider-wrapper .transcript-provider-group')
).not.toExist();
}); });
it('shows error message on saving organization credentials if server sends error', function() { it('shows error message on saving organization credentials if server sends error', function() {
var requests = AjaxHelpers.requests(this);
verifyProviderSelectedView(); verifyProviderSelectedView();
// Click change button to render organization credentials view.
$courseVideoSettingsEl.find('.action-change-provider').click();
// Set organization credentials so as to pass validations.
$courseVideoSettingsEl.find('.' + courseVideoSettingsView.selectedProvider + '-api-key').val('testkey');
// Click save organization credentials button to save credentials.
$courseVideoSettingsEl.find('.action-update-org-credentials').click();
AjaxHelpers.expectRequest( submitOrganizationCredentials({
requests, api_key: 'api-key',
'POST', username: 'username'
transcriptCredentialsHandlerUrl, }, 'Error saving credentials');
JSON.stringify({
provider: activeTranscriptPreferences.provider,
global: false
})
);
// Send error response.
AjaxHelpers.respondWithError(requests, 400, {
error: 'Error message'
});
// Verify that error message is shown. // Verify that error message is shown.
verifyMessage('error', 'Error message'); verifyMessage('error', 'Error saving credentials');
}); });
// TODO: Add more tests like clicking on add language, remove and their scenarios and some other tests // TODO: Add more tests like clicking on add language, remove and their scenarios and some other tests
......
cms/static/js/views/course_video_settings.js
...@@ -606,6 +606,7 @@ function($, Backbone, _, gettext, moment, ViewUtils, HtmlUtils, StringUtils, Tra ...@@ -606,6 +606,7 @@ function($, Backbone, _, gettext, moment, ViewUtils, HtmlUtils, StringUtils, Tra
validateOrganizationCredentials: function() { validateOrganizationCredentials: function() {
var $OrganizationApiSecretWrapperEl, var $OrganizationApiSecretWrapperEl,
$OrganizationUsernameWrapperEl,
isValid = true, isValid = true,
$OrganizationApiKeyWrapperEl = this.$el.find('.' + this.selectedProvider + '-api-key-wrapper'); $OrganizationApiKeyWrapperEl = this.$el.find('.' + this.selectedProvider + '-api-key-wrapper');
...@@ -630,6 +631,14 @@ function($, Backbone, _, gettext, moment, ViewUtils, HtmlUtils, StringUtils, Tra ...@@ -630,6 +631,14 @@ function($, Backbone, _, gettext, moment, ViewUtils, HtmlUtils, StringUtils, Tra
} else { } else {
this.clearPreferenceErrorState($OrganizationApiSecretWrapperEl); this.clearPreferenceErrorState($OrganizationApiSecretWrapperEl);
} }
} else {
$OrganizationUsernameWrapperEl = this.$el.find('.' + this.selectedProvider + '-username-wrapper');
if ($OrganizationUsernameWrapperEl.find('input').val() === '') {
isValid = false;
this.addErrorState($OrganizationUsernameWrapperEl);
} else {
this.clearPreferenceErrorState($OrganizationUsernameWrapperEl);
}
} }
return isValid; return isValid;
...@@ -673,14 +682,25 @@ function($, Backbone, _, gettext, moment, ViewUtils, HtmlUtils, StringUtils, Tra ...@@ -673,14 +682,25 @@ function($, Backbone, _, gettext, moment, ViewUtils, HtmlUtils, StringUtils, Tra
}, },
saveOrganizationCredentials: function() { saveOrganizationCredentials: function() {
var self = this; var self = this,
username,
apiSecret,
apiKey = this.$el.find('.' + this.selectedProvider + '-api-key').val();
// First clear response status if present already // First clear response status if present already
this.clearResponseStatus(); this.clearResponseStatus();
// TODO: Send actual organization credentials. if (this.selectedProvider === THREE_PLAY_MEDIA) {
apiSecret = this.$el.find('.' + this.selectedProvider + '-api-secret').val();
} else {
username = this.$el.find('.' + this.selectedProvider + '-username').val();
}
$.postJSON(self.transcriptCredentialsHandlerUrl, { $.postJSON(self.transcriptCredentialsHandlerUrl, {
provider: self.selectedProvider, provider: self.selectedProvider,
api_key: apiKey,
api_secret_key: apiSecret,
username: username,
global: false // Do not trigger global AJAX error handler global: false // Do not trigger global AJAX error handler
}, function() { }, function() {
self.$el.find('.organization-credentials-wrapper').hide(); self.$el.find('.organization-credentials-wrapper').hide();
......
cms/static/sass/views/_video-upload.scss
...@@ -86,13 +86,10 @@ ...@@ -86,13 +86,10 @@
.organization-credentials-content { .organization-credentials-content {
margin-top: ($baseline*1.6); margin-top: ($baseline*1.6);
.org-credentials-wrapper input { .org-credentials-wrapper input {
width: 75%; width: 65%;
margin: ($baseline*0.8) 0; margin-top: ($baseline*0.8);
} display: inline-block;
.action-update-org-credentials {
margin-top: ($baseline*1.6);
} }
} }
.transcript-preferance-wrapper { .transcript-preferance-wrapper {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment