Skip to content

Commit

Permalink
[#12081] Create unique id for rubric table cell (#12205)
Browse files Browse the repository at this point in the history
  • Loading branch information
@jasonqiu212 @zhaojj2209
jasonqiu212 authored and zhaojj2209 committed Mar 23, 2023
1 parent ecb1482 commit 109645d
Show file tree
Hide file tree
Showing 3 changed files with 89 additions and 60 deletions.
17 changes: 9 additions & 8 deletions .../question-types/question-edit-answer-form/rubric-question-edit-answer-form.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,13 +10,14 @@
[ngClass]="{ 'row-answered': i < responseDetails.answer.length && responseDetails.answer[i] !== RUBRIC_ANSWER_NOT_CHOSEN }">
<th class="fw-normal" scope="row">{{ questionDetails.rubricSubQuestions[i] }}</th>
<td *ngFor="let rubricDescriptionCell of rubricDescriptionRow; let j = index;" class="text-secondary answer-cell" (click)="selectAnswer(i, j)">
<label>
<input
type="radio"
[disabled]="isDisabled"
[name]="id + i + '-desktop'"
[checked]="i < responseDetails.answer.length && responseDetails.answer[i] === j"
/>
<input
type="radio"
[disabled]="isDisabled"
[name]="getInputId(id, i, j, 'desktop')"
[id]="getInputId(id, i, j, 'desktop')"
[checked]="i < responseDetails.answer.length && responseDetails.answer[i] === j"
/>
<label [for]="getInputId(id, i, j, 'desktop')" (click)="$event.stopPropagation()">
{{ rubricDescriptionCell }}
</label>
</td>
Expand All @@ -36,7 +37,7 @@
type="radio"
[disabled]="isDisabled"
(click)="selectAnswer(i, j)"
[name]="id + i + '-mobile'"
[name]="getInputId(id, i, j, 'mobile')"
[checked]="i < responseDetails.answer.length && responseDetails.answer[i] === j"
[attr.aria-label]="getAriaLabelForChoice(questionDetails.rubricChoices[j], rubricDescriptionCell, questionDetails.rubricSubQuestions[i])"
>
Expand Down
4 changes: 4 additions & 0 deletions ...ts/question-types/question-edit-answer-form/rubric-question-edit-answer-form.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -67,4 +67,8 @@ export class RubricQuestionEditAnswerFormComponent extends QuestionEditAnswerFor
getChoiceWithDescription(choice: String, choiceDescription: String): String {
return choiceDescription ? `${choice} - ${choiceDescription}` : choice;
}

getInputId(id: String, row: Number, col: Number, platform: String): String {
return `${id}-row${row}-col${col}-${platform}`;
}
}
128 changes: 76 additions & 52 deletions ...sion/session-submission-page/__snapshots__/session-submission-page.component.spec.ts.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2726,22 +2726,28 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
<td
class="text-secondary answer-cell"
>
<label>
<input
name="feedback-question-id-rubricbarry-harris-id0-desktop"
type="radio"
/>
<input
id="feedback-question-id-rubricbarry-harris-id-row0-col0-desktop"
name="feedback-question-id-rubricbarry-harris-id-row0-col0-desktop"
type="radio"
/>
<label
for="feedback-question-id-rubricbarry-harris-id-row0-col0-desktop"
>
description 1
</label>
</td>
<td
class="text-secondary answer-cell"
>
<label>
<input
name="feedback-question-id-rubricbarry-harris-id0-desktop"
type="radio"
/>
<input
id="feedback-question-id-rubricbarry-harris-id-row0-col1-desktop"
name="feedback-question-id-rubricbarry-harris-id-row0-col1-desktop"
type="radio"
/>
<label
for="feedback-question-id-rubricbarry-harris-id-row0-col1-desktop"
>
description 2
</label>
</td>
Expand All @@ -2758,22 +2764,28 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
<td
class="text-secondary answer-cell"
>
<label>
<input
name="feedback-question-id-rubricbarry-harris-id1-desktop"
type="radio"
/>
<input
id="feedback-question-id-rubricbarry-harris-id-row1-col0-desktop"
name="feedback-question-id-rubricbarry-harris-id-row1-col0-desktop"
type="radio"
/>
<label
for="feedback-question-id-rubricbarry-harris-id-row1-col0-desktop"
>
description 3
</label>
</td>
<td
class="text-secondary answer-cell"
>
<label>
<input
name="feedback-question-id-rubricbarry-harris-id1-desktop"
type="radio"
/>
<input
id="feedback-question-id-rubricbarry-harris-id-row1-col1-desktop"
name="feedback-question-id-rubricbarry-harris-id-row1-col1-desktop"
type="radio"
/>
<label
for="feedback-question-id-rubricbarry-harris-id-row1-col1-desktop"
>
description 4
</label>
</td>
Expand All @@ -2799,7 +2811,7 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
<label>
<input
aria-label="choice 1 - description 1 Response for Barry Harris under Criteria of subquestion 1"
name="feedback-question-id-rubricbarry-harris-id0-mobile"
name="feedback-question-id-rubricbarry-harris-id-row0-col0-mobile"
type="radio"
/>
choice 1 - description 1
Expand All @@ -2809,7 +2821,7 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
<label>
<input
aria-label="choice 2 - description 2 Response for Barry Harris under Criteria of subquestion 1"
name="feedback-question-id-rubricbarry-harris-id0-mobile"
name="feedback-question-id-rubricbarry-harris-id-row0-col1-mobile"
type="radio"
/>
choice 2 - description 2
Expand All @@ -2832,7 +2844,7 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
<label>
<input
aria-label="choice 1 - description 3 Response for Barry Harris under Criteria of subquestion 2"
name="feedback-question-id-rubricbarry-harris-id1-mobile"
name="feedback-question-id-rubricbarry-harris-id-row1-col0-mobile"
type="radio"
/>
choice 1 - description 3
Expand All @@ -2842,7 +2854,7 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
<label>
<input
aria-label="choice 2 - description 4 Response for Barry Harris under Criteria of subquestion 2"
name="feedback-question-id-rubricbarry-harris-id1-mobile"
name="feedback-question-id-rubricbarry-harris-id-row1-col1-mobile"
type="radio"
/>
choice 2 - description 4
Expand Down Expand Up @@ -5425,24 +5437,30 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
<td
class="text-secondary answer-cell"
>
<label>
<input
disabled=""
name="feedback-question-id-rubricbarry-harris-id0-desktop"
type="radio"
/>
<input
disabled=""
id="feedback-question-id-rubricbarry-harris-id-row0-col0-desktop"
name="feedback-question-id-rubricbarry-harris-id-row0-col0-desktop"
type="radio"
/>
<label
for="feedback-question-id-rubricbarry-harris-id-row0-col0-desktop"
>
description 1
</label>
</td>
<td
class="text-secondary answer-cell"
>
<label>
<input
disabled=""
name="feedback-question-id-rubricbarry-harris-id0-desktop"
type="radio"
/>
<input
disabled=""
id="feedback-question-id-rubricbarry-harris-id-row0-col1-desktop"
name="feedback-question-id-rubricbarry-harris-id-row0-col1-desktop"
type="radio"
/>
<label
for="feedback-question-id-rubricbarry-harris-id-row0-col1-desktop"
>
description 2
</label>
</td>
Expand All @@ -5459,24 +5477,30 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
<td
class="text-secondary answer-cell"
>
<label>
<input
disabled=""
name="feedback-question-id-rubricbarry-harris-id1-desktop"
type="radio"
/>
<input
disabled=""
id="feedback-question-id-rubricbarry-harris-id-row1-col0-desktop"
name="feedback-question-id-rubricbarry-harris-id-row1-col0-desktop"
type="radio"
/>
<label
for="feedback-question-id-rubricbarry-harris-id-row1-col0-desktop"
>
description 3
</label>
</td>
<td
class="text-secondary answer-cell"
>
<label>
<input
disabled=""
name="feedback-question-id-rubricbarry-harris-id1-desktop"
type="radio"
/>
<input
disabled=""
id="feedback-question-id-rubricbarry-harris-id-row1-col1-desktop"
name="feedback-question-id-rubricbarry-harris-id-row1-col1-desktop"
type="radio"
/>
<label
for="feedback-question-id-rubricbarry-harris-id-row1-col1-desktop"
>
description 4
</label>
</td>
Expand All @@ -5503,7 +5527,7 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
<input
aria-label="choice 1 - description 1 Response for Barry Harris under Criteria of subquestion 1"
disabled=""
name="feedback-question-id-rubricbarry-harris-id0-mobile"
name="feedback-question-id-rubricbarry-harris-id-row0-col0-mobile"
type="radio"
/>
choice 1 - description 1
Expand All @@ -5514,7 +5538,7 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
<input
aria-label="choice 2 - description 2 Response for Barry Harris under Criteria of subquestion 1"
disabled=""
name="feedback-question-id-rubricbarry-harris-id0-mobile"
name="feedback-question-id-rubricbarry-harris-id-row0-col1-mobile"
type="radio"
/>
choice 2 - description 2
Expand All @@ -5538,7 +5562,7 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
<input
aria-label="choice 1 - description 3 Response for Barry Harris under Criteria of subquestion 2"
disabled=""
name="feedback-question-id-rubricbarry-harris-id1-mobile"
name="feedback-question-id-rubricbarry-harris-id-row1-col0-mobile"
type="radio"
/>
choice 1 - description 3
Expand All @@ -5549,7 +5573,7 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
<input
aria-label="choice 2 - description 4 Response for Barry Harris under Criteria of subquestion 2"
disabled=""
name="feedback-question-id-rubricbarry-harris-id1-mobile"
name="feedback-question-id-rubricbarry-harris-id-row1-col1-mobile"
type="radio"
/>
choice 2 - description 4
Expand Down

0 comments on commit 109645d

Please sign in to comment.