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

Team card teamset name (#24360)

Browse Source 
* show teamset as pennant in team cards within my_teams view

* update verifyCards spec helper to be able to check teamset label

* update tests for team_card teamset label.

Co-authored-by: Ben Warzeski <benwarzeski@edX-C02CD0HCLVDM.cable.rcn.com>
This commit is contained in:
Ben Warzeski
2020-07-01 15:37:45 -04:00
committed by GitHub
parent bba346cb7f
commit d99890fb1a
7 changed files with 92 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
lms/djangoapps/teams/static/teams/js/spec/views/my_teams_spec.js
View File

@@ -13,7 +13,10 @@ define([
});
mockGetTopic = function(topicId) {
return $.Deferred().resolve(TeamSpecHelpers.createMockTopic({id: topicId}));
return $.Deferred().resolve(TeamSpecHelpers.createMockTopic({
id: topicId,
name: 'teamset-name-' + topicId,
}));
};
createMyTeamsView = function(myTeams) {
@@ -78,5 +81,11 @@ define([
);
AjaxHelpers.respondWithJson(requests, {});
});
it('sets showTeamsetOnTeamCards on child Teams view', function() {
var teams = TeamSpecHelpers.createMockTeams({results: []}),
myTeamsView = createMyTeamsView(teams);
TeamSpecHelpers.verifyCards(myTeamsView, [], true);
});
});
});

42
lms/djangoapps/teams/static/teams/js/spec/views/team_card_spec.js
View File

@@ -1,41 +1,54 @@
define(['jquery',
'underscore',
'moment',
'teams/js/spec_helpers/team_spec_helpers',
'teams/js/views/team_card',
'teams/js/models/team',
'teams/js/models/topic'],
function($, _, moment, TeamCardView, Team, Topic) {
function($, _, moment, TeamSpecHelpers, TeamCardView, Team, Topic) {
'use strict';
describe('TeamCardView', function() {
var createTeamCardView, view;
var teamName = 'Test Team',
teamID = 'test-team',
courseID = TeamSpecHelpers.testCourseID,
teamsetID = TeamSpecHelpers.testTopicID,
teamsetName = 'Team Set',
description = 'A team for testing';
createTeamCardView = function(topicOptions) {
var model = new Team({
id: 'test-team',
name: 'Test Team',
id: teamID,
name: teamName,
course_id: courseID,
topic_id: teamsetID,
description: description,
is_active: true,
course_id: 'test/course/id',
topic_id: 'test-topic',
description: 'A team for testing',
last_activity_at: '2015-08-21T18:53:01.145Z',
country: 'us',
language: 'en',
membership: []
}),
topic = new Topic(_.extend({id: 'test-topic'}, topicOptions)),
topic = new Topic(_.extend({
id: teamsetID,
name: teamsetName,
}, topicOptions)),
TeamCardClass = TeamCardView.extend({
courseMaxTeamSize: '100',
srInfo: {
id: 'test-sr-id',
text: 'Screenreader text'
},
showTeamset: true,
countries: {us: 'United States of America'},
languages: {en: 'English'},
// eslint-disable-next-line no-unused-vars
getTopic: function(topicId) { return $.Deferred().resolve(topic); }
});
return new TeamCardClass({
model: model
model: model,
showTopic: true,
});
};
@@ -47,8 +60,9 @@ define(['jquery',
it('can render itself', function() {
expect(view.$el).toHaveClass('list-card');
expect(view.$el.find('.card-title').text()).toContain('Test Team');
expect(view.$el.find('.card-description').text()).toContain('A team for testing');
expect(view.$el.find('.card-title').text()).toContain(teamName);
expect(view.$el.find('.card-description').text()).toContain(description);
expect(view.$el.find('.card-type').text()).toContain(teamsetName);
expect(view.$el.find('.team-activity abbr').attr('title')).toContain('August 21st 2015');
expect(view.$el.find('.team-activity').text()).toContain('Last activity');
expect(view.$el.find('.card-meta').text()).toContain('0 / 100 Members');
@@ -56,8 +70,14 @@ define(['jquery',
expect(view.$el.find('.team-language').text()).toContain('English');
});
it('does not show teamset name is showTeamset is false', function() {
view.showTeamset = false;
view.render();
expect(view.$el.find('.card-type').length).toEqual(0);
});
it('navigates to the associated team page when its action button is clicked', function() {
expect(view.$('.action').attr('href')).toEqual('#teams/test-topic/test-team');
expect(view.$('.action').attr('href')).toEqual('#teams/' + teamsetID + '/' + teamID);
});
describe('Profile Image Thumbnails', function() {

21
lms/djangoapps/teams/static/teams/js/spec/views/teams_spec.js
View File

@@ -16,13 +16,17 @@ define([
var MockTeamsView = TeamsView.extend({
// eslint-disable-next-line no-unused-vars
getTopic: function(topicId) {
return $.Deferred().resolve(TeamSpecHelpers.createMockTopic({}));
}
return $.Deferred().resolve(TeamSpecHelpers.createMockTopic({
id: topicId,
name: 'teamset-name-' + topicId,
}));
},
});
return new MockTeamsView({
el: '.teams-container',
collection: options.teams || TeamSpecHelpers.createMockTeams(),
showActions: true,
showTeamset: options.showTeamset,
context: TeamSpecHelpers.testContext
}).render();
};
@@ -40,7 +44,18 @@ define([
expect(footerEl.text()).toMatch('1\\s+out of\\s+\/\\s+2'); // eslint-disable-line no-useless-escape
expect(footerEl).not.toHaveClass('hidden');
TeamSpecHelpers.verifyCards(teamsView, testTeamData);
TeamSpecHelpers.verifyCards(teamsView, testTeamData, false);
});
it('forwards the showTeamset option to loaded team cards)', function() {
var testTeamData = TeamSpecHelpers.createMockTeamData(1, 5),
teamsView = createTeamsView({
teams: TeamSpecHelpers.createMockTeams({
results: testTeamData
}),
showTeamset: true,
});
TeamSpecHelpers.verifyCards(teamsView, testTeamData, true);
});
});
});

20
lms/djangoapps/teams/static/teams/js/spec_helpers/team_spec_helpers.js
View File

@@ -113,13 +113,31 @@ define([
);
};
var verifyCards = function(view, teams) {
/**
* Verify that the given view shows cards for each of the teams included.
* If showTeamset is included (true or false), the test will also verify that the teamset
* label/penannt is or is not included in the card accordingly.
*
* @param {JQ Element} view - jquery DOM element for the card container
* @param {TeamModel[]} teams - list of teams to verify.
* @param {[bool]} showTeamset - should show teamset string? (if not included, do not check
* the teamset string at all)
*/
var verifyCards = function(view, teams, showTeamset) {
var teamCards = view.$('.team-card');
_.each(teams, function(team, index) {
var currentCard = teamCards.eq(index);
var teamsetString = 'teamset-name-' + team.topic_id;
expect(currentCard.text()).toMatch(team.name);
expect(currentCard.text()).toMatch(_.object(testLanguages)[team.language]);
expect(currentCard.text()).toMatch(_.object(testCountries)[team.country]);
if (showTeamset === false) {
expect(currentCard.text()).not.toMatch(teamsetString);
}
if (showTeamset === true) {
expect(currentCard.text()).toMatch(teamsetString);
}
});
};

8
lms/djangoapps/teams/static/teams/js/views/my_teams.js
View File

@@ -7,7 +7,13 @@
initialize: function(options) {
this.getTopic = options.getTopic;
TeamsView.prototype.initialize.call(this, options);
TeamsView.prototype.initialize.call(
this,
_.extend(
{ showTeamset: true },
options
)
);
},
render: function() {

6
lms/djangoapps/teams/static/teams/js/views/team_card.js
View File

@@ -138,11 +138,17 @@
this.model.on('change:membership', function() {
this.detailViews[0].memberships = this.model.get('membership');
}, this);
this.teamsetName = null;
this.getTopic(this.model.get('topic_id')).done(_.bind(function(teamset) {
this.teamsetName = teamset.get('name');
}, this));
},
configuration: 'list_card',
cardClass: 'team-card',
title: function() { return this.model.get('name'); },
pennant: function() { return this.showTeamset ? this.teamsetName : undefined; },
description: function() { return this.model.get('description'); },
details: function() { return this.detailViews; },
actionClass: 'action-view',

1
lms/djangoapps/teams/static/teams/js/views/teams.js
View File

@@ -24,6 +24,7 @@
router: options.router,
courseMaxTeamSize: this.context.courseMaxTeamSize,
srInfo: this.srInfo,
showTeamset: options.showTeamset,
countries: TeamUtils.selectorOptionsArrayToHashWithBlank(this.context.countries),
languages: TeamUtils.selectorOptionsArrayToHashWithBlank(this.context.languages),
getTopic: function(topicId) { return view.getTopic(topicId); }