Skip to content

Commit

Permalink
Add tests for minutes input and move logic for handling rounding into…
Browse files Browse the repository at this point in the history 
… separate method
  • Loading branch information
@sairina
sairina committed Jul 22, 2022
1 parent 7ca87d1 commit 60a8362
Show file tree
Hide file tree
Showing 2 changed files with 130 additions and 60 deletions.
95 changes: 54 additions & 41 deletions contentcuration/contentcuration/frontend/channelEdit/components/edit/CompletionOptions.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -177,9 +177,9 @@ export default {
},
hideCompletionDropdown() {
/*
This condition can be removed once practice quizzes are fully implemented in 0.16
Named "hide" instead of "show" because "show" is the default behavior
*/
This condition can be removed once practice quizzes are fully implemented in 0.16
Named "hide" instead of "show" because "show" is the default behavior
*/
return this.practiceQuizzesAllowed;
},
audioVideoResource() {
Expand All @@ -204,8 +204,8 @@ export default {
},
showReferenceHint() {
/*
The reference hint should be shown only when "Reference" is selected
*/
The reference hint should be shown only when "Reference" is selected
*/
if (this.value) {
if (this.kind === ContentKindsNames.H5P || this.kind === ContentKindsNames.HTML5) {
if (this.currentCompletionDropdown === CompletionDropdownMap.determinedByResource) {
Expand All @@ -230,10 +230,10 @@ export default {
},
showActivityDurationInput() {
/* The `ActivityDuration` component should visible when:
- Long activity, short activity, or exact time are chosen if it is not an AV resource
- Long activity or short activity are chosen if it is an AV resource
- Long activity, short activity, or exact time are chosen in HTML5
*/
- Long activity, short activity, or exact time are chosen if it is not an AV resource
- Long activity or short activity are chosen if it is an AV resource
- Long activity, short activity, or exact time are chosen in HTML5
*/
if (this.value) {
const switchingFromReferenceBetweenAllContentViewedAndCompleteDuration =
this.value.suggested_duration === null || this.value.suggested_duration_type === null;
Expand Down Expand Up @@ -426,7 +426,10 @@ export default {
const defaultStateWhenSwitchingFromGoalToPracticeQuiz =
this.value.threshold.mastery_model === MasteryModelsNames.M_OF_N &&
this.currentCompletionDropdown === null;
if (this.currentCompletionDropdown === CompletionDropdownMap.goal) {
if (
this.currentCompletionDropdown === CompletionDropdownMap.goal &&
this.value.threshold.mastery_model === MasteryModelsNames.M_OF_N
) {
return true;
}
if (defaultStateWhenSwitchingFromGoalToPracticeQuiz) {
Expand Down Expand Up @@ -578,21 +581,17 @@ export default {
}
if (duration === DurationDropdownMap.SHORT_ACTIVITY) {
update.suggested_duration_type = SuggestedDurationTypesMap.APPROX_TIME;
const roundedValue = Math.round(this.value.suggested_duration / 300) * 300;
if (roundedValue > SHORT_LONG_ACTIVITY_MIDPOINT || roundedValue <= 0) {
update.suggested_duration = DEFAULT_SHORT_ACTIVITY;
} else {
update.suggested_duration = roundedValue;
}
update.suggested_duration = this.handleMinutesInputFromActivityDuration(
this.value.suggested_duration,
duration
);
}
if (duration === DurationDropdownMap.LONG_ACTIVITY) {
update.suggested_duration_type = SuggestedDurationTypesMap.APPROX_TIME;
const roundedValue = Math.round(this.value.suggested_duration / 600) * 600;
if (roundedValue < SHORT_LONG_ACTIVITY_MIDPOINT || roundedValue > 7200) {
update.suggested_duration = DEFAULT_LONG_ACTIVITY;
} else {
update.suggested_duration = roundedValue;
}
update.suggested_duration = this.handleMinutesInputFromActivityDuration(
this.value.suggested_duration,
duration
);
}
update.completion_criteria = {
model: CompletionCriteriaModels.PAGES,
Expand All @@ -607,25 +606,21 @@ export default {
) {
if (duration === DurationDropdownMap.SHORT_ACTIVITY) {
update.suggested_duration_type = SuggestedDurationTypesMap.APPROX_TIME;
const roundedValue = Math.round(this.value.suggested_duration / 300) * 300;
if (roundedValue > SHORT_LONG_ACTIVITY_MIDPOINT || roundedValue <= 0) {
update.suggested_duration = DEFAULT_SHORT_ACTIVITY;
} else {
update.suggested_duration = roundedValue;
}
update.suggested_duration = this.handleMinutesInputFromActivityDuration(
this.value.suggested_duration,
duration
);
update.completion_criteria = {
model: CompletionCriteriaModels.APPROX_TIME,
threshold: update.suggested_duration,
};
}
if (duration === DurationDropdownMap.LONG_ACTIVITY) {
update.suggested_duration_type = SuggestedDurationTypesMap.APPROX_TIME;
const roundedValue = Math.round(this.value.suggested_duration / 600) * 600;
if (roundedValue < SHORT_LONG_ACTIVITY_MIDPOINT || roundedValue > 7200) {
update.suggested_duration = DEFAULT_LONG_ACTIVITY;
} else {
update.suggested_duration = roundedValue;
}
update.suggested_duration = this.handleMinutesInputFromActivityDuration(
this.value.suggested_duration,
duration
);
update.completion_criteria = {
model: CompletionCriteriaModels.APPROX_TIME,
threshold: update.suggested_duration,
Expand All @@ -643,13 +638,10 @@ export default {
if (this.value.model === CompletionCriteriaModels.MASTERY) {
if (duration === DurationDropdownMap.SHORT_ACTIVITY) {
update.suggested_duration_type = SuggestedDurationTypesMap.APPROX_TIME;
const roundedValue = Math.round(this.value.suggested_duration / 300) * 300;
if (roundedValue > SHORT_LONG_ACTIVITY_MIDPOINT || roundedValue <= 0) {
update.suggested_duration = DEFAULT_SHORT_ACTIVITY;
} else {
update.suggested_duration = roundedValue;
}
update.suggested_duration = this.handleMinutesInputFromActivityDuration(
this.value.suggested_duration,
duration
);
update.completion_criteria = {
model: this.value.model,
threshold: this.value.threshold,
Expand Down Expand Up @@ -804,6 +796,27 @@ export default {
trackClick(label) {
this.$analytics.trackClick('channel_editor_modal_details', label);
},
handleMinutesInputFromActivityDuration(minutes, duration) {
let suggested_duration;
let roundedValue;
if (duration === DurationDropdownMap.SHORT_ACTIVITY) {
roundedValue = Math.round(minutes / 300) * 300;
if (roundedValue > SHORT_LONG_ACTIVITY_MIDPOINT || roundedValue <= 0) {
suggested_duration = DEFAULT_SHORT_ACTIVITY;
} else {
suggested_duration = roundedValue;
}
}
if (duration === DurationDropdownMap.LONG_ACTIVITY) {
roundedValue = Math.round(minutes / 600) * 600;
if (roundedValue < SHORT_LONG_ACTIVITY_MIDPOINT || roundedValue > 7200) {
suggested_duration = DEFAULT_LONG_ACTIVITY;
} else {
suggested_duration = roundedValue;
}
}
return suggested_duration;
},
handleInput({
completion_criteria,
suggested_duration,
Expand Down
95 changes: 76 additions & 19 deletions .../contentcuration/frontend/channelEdit/components/edit/__tests__/completionOptions.spec.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@ describe('CompletionOptions', () => {
});
describe(`initial, default states`, () => {
describe(`audio/video`, () => {
//!TODO FIX
it(`'Complete duration' should be displayed by default`, () => {
const wrapper = mount(CompletionOptions, {
propsData: {
Expand Down Expand Up @@ -72,6 +73,9 @@ describe('CompletionOptions', () => {
});
expect(wrapper.vm.completionDropdown).toBe('reference');
});
it(`time from file should be displayed when duration dropdown is 'Exact time to complete'`, () => {
//! TODO FIX
});
});
describe(`document`, () => {
//! TODO FIX
Expand Down Expand Up @@ -687,30 +691,83 @@ describe('CompletionOptions', () => {
});
});
});
xdescribe(`minutes input`, () => {
//Note: while the component itself is in another component,
describe(`minutes input`, () => {
//Note: while the 'ActivityDuration' component itself is in another component,
//the logic to get the data ready for the BE is in this component
//test for the initial state (does it show or not show) when you click on resources
describe(`in 'Short activity'`, () => {
it(`should increment by 5-minute intervals`, () => {
// const wrapper = mount(ActivityDuration, {
// propsData: {
// selectedDuration: 'longActivity',
// },
// });
// expect(wrapper.html()).toContain(`step="5"`);
// expect(wrapper.html()).not.toContain(`step="10"`);
describe(`correct handling of values for switching from 'Exact time' to 'Short activity' or 'Long activity'`, () => {
it(`displays default 'Short activity' value when input > the max allowed for 'Short activity'`, () => {
const shortActivityDefaultValue = 600;
const wrapper = mount(CompletionOptions, {
propsData: {
kind: 'document',
value: {
model: 'pages',
threshold: '100%',
suggested_duration: 3060,
suggested_duration_type: 'time',
},
},
});

expect(wrapper.vm.handleMinutesInputFromActivityDuration(3060, `shortActivity`)).toBe(
shortActivityDefaultValue
);
});
it(`should round to the nearest 5-minute`, () => {
// const wrapper = mount(ActivityDuration);
it(`displays default 'Long activity' value when input < the min allowed for 'Long activity'`, () => {
const longActivityDefaultValue = 3000;
const wrapper = mount(CompletionOptions, {
propsData: {
kind: 'document',
value: {
model: 'pages',
threshold: '100%',
suggested_duration: 50,
suggested_duration_type: 'time',
},
},
});

expect(wrapper.vm.handleMinutesInputFromActivityDuration(50, `longActivity`)).toBe(
longActivityDefaultValue
);
});
it(`minimum accepted input should be 5 minutes`, () => {});
it(`maximum accepted input should be 30 minutes`, () => {});
});
describe(`correct handling of values for switching from 'Short activity' or 'Long activity' to 'Exact Time'`, () => {
it(`displays 'Long activity' value`, async () => {
const wrapper = mount(CompletionOptions, {
propsData: {
kind: 'document',
value: {
model: 'pages',
threshold: '100%',
suggested_duration: 4200,
suggested_duration_type: 'approx_time',
},
},
});
wrapper.find({ ref: 'duration' }).vm.$emit('input', 'exactTime');
await wrapper.vm.$nextTick();

expect(wrapper.vm.currentDurationDropdown).toBe('exactTime');
expect(wrapper.vm.minutes).toBe(4200);
});
it(`displays 'Short activity' value`, async () => {
const wrapper = mount(CompletionOptions, {
propsData: {
kind: 'document',
value: {
model: 'pages',
threshold: '100%',
suggested_duration: 200,
suggested_duration_type: 'approx_time',
},
},
});
wrapper.find({ ref: 'duration' }).vm.$emit('input', 'exactTime');
await wrapper.vm.$nextTick();

xdescribe(`default states`, () => {
it(`time from file should be displayed when duration dropdown is 'Exact time to complete'`, () => {
//done
expect(wrapper.vm.currentDurationDropdown).toBe('exactTime');
expect(wrapper.vm.minutes).toBe(200);
});
});
});
Expand Down

0 comments on commit 60a8362

Please sign in to comment.