Commit 31be6fad by Ehtesham Committed by muzaffaryousaf

make CAPA dropdown problems accessible

parent e1a595d8
...@@ -35,8 +35,8 @@ class TemplateTests(ModuleStoreTestCase): ...@@ -35,8 +35,8 @@ class TemplateTests(ModuleStoreTestCase):
self.assertIsNotNone(dropdown) self.assertIsNotNone(dropdown)
self.assertIn('markdown', dropdown['metadata']) self.assertIn('markdown', dropdown['metadata'])
self.assertIn('data', dropdown) self.assertIn('data', dropdown)
self.assertRegexpMatches(dropdown['metadata']['markdown'], r'^Dropdown.*') self.assertRegexpMatches(dropdown['metadata']['markdown'], r'.*dropdown problems.*')
self.assertRegexpMatches(dropdown['data'], r'<problem>\s*<optionresponse>\s*<p>Dropdown.*') self.assertRegexpMatches(dropdown['data'], r'<problem>\s*<optionresponse>\s*<p>.*dropdown problems.*')
def test_get_some_templates(self): def test_get_some_templates(self):
self.assertEqual(len(SequenceDescriptor.templates()), 0) self.assertEqual(len(SequenceDescriptor.templates()), 0)
......
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
<div class="${status.classname}" id="status_${id}"> <div class="${status.classname}" id="status_${id}">
<input type="text" name="input_${id}" id="input_${id}" <input type="text" name="input_${id}" id="input_${id}"
data-input-id="${id}" value="${value}" data-input-id="${id}" value="${value}"
${describedby} ${describedby| n}
% if size: % if size:
size="${size}" size="${size}"
% endif % endif
......
<% doinline = "inline" if inline else "" %> <% doinline = "inline" if inline else "" %>
<form class="inputtype option-input ${doinline}"> <form class="inputtype option-input ${doinline}">
<select name="input_${id}" id="input_${id}" aria-label="${response_data['label']}" ${describedby}> <label class="problem-group-label" for="input_${id}">
${response_data['label']}
</label>
% for description_id, description_text in response_data['descriptions'].items():
<p class="question-description" id="${description_id}">${description_text}</p>
% endfor
<select name="input_${id}" id="input_${id}" ${describedby}>
<option value="option_${id}_dummy_default"> </option> <option value="option_${id}_dummy_default"> </option>
% for option_id, option_description in options: % for option_id, option_description in options:
<option value="${option_id}" <option value="${option_id}"
% if (option_id==value or option_id==answervariable): % if (option_id == value or option_id == answervariable):
selected="true" selected="true"
% endif % endif
> ${option_description}</option> > ${option_description}</option>
...@@ -16,12 +24,11 @@ ...@@ -16,12 +24,11 @@
<span class="status ${status.classname}" <span class="status ${status.classname}"
id="status_${id}" id="status_${id}"
aria-describedby="input_${id}" data-tooltip="${status.display_tooltip}"> aria-describedby="input_${id}" data-tooltip="${status.display_tooltip}">
<span class="sr">${value|h} - ${status.display_tooltip}</span> <span class="sr">${value|h} - ${status.display_tooltip}</span>
</span> </span>
</div> </div>
<p class="answer" id="answer_${id}"></p> <p class="answer" id="answer_${id}"></p>
% if msg: % if msg:
<span class="message">${msg|n}</span> <span class="message">${msg|n}</span>
% endif % endif
</form> </form>
...@@ -20,7 +20,7 @@ ...@@ -20,7 +20,7 @@
% for description_id, description_text in response_data['descriptions'].items(): % for description_id, description_text in response_data['descriptions'].items():
<p class="question-description" id="${description_id}">${description_text}</p> <p class="question-description" id="${description_id}">${description_text}</p>
% endfor % endfor
<input type="text" name="input_${id}" id="input_${id}" ${describedby} value="${value}" <input type="text" name="input_${id}" id="input_${id}" ${describedby| n} value="${value}"
% if do_math: % if do_math:
class="math" class="math"
% endif % endif
......
...@@ -813,15 +813,15 @@ class OptionInputTemplateTest(TemplateTestCase): ...@@ -813,15 +813,15 @@ class OptionInputTemplateTest(TemplateTestCase):
def test_label(self): def test_label(self):
xml = self.render_to_xml(self.context) xml = self.render_to_xml(self.context)
xpath = "//select[@aria-label='%s']" % self.context['response_data']['label'] xpath = "//label[@class='problem-group-label']"
self.assert_has_xpath(xml, xpath, self.context) self.assert_has_xpath(xml, xpath, self.RESPONSE_DATA['label'])
def test_description(self): def test_description(self):
""" """
Test that correct description information is set on desired elements. Test that correct description information is set on desired elements.
""" """
xpaths = ['//select/@aria-describedby'] xpaths = ['//select/@aria-describedby']
self.assert_description(xpaths, descriptions=False) self.assert_description(xpaths)
self.assert_describedby_attribute(xpaths) self.assert_describedby_attribute(xpaths)
......
...@@ -156,6 +156,13 @@ div.problem { ...@@ -156,6 +156,13 @@ div.problem {
.question-description { .question-description {
@include margin(($baseline*0.75), 0); @include margin(($baseline*0.75), 0);
} }
form > label {
display: block;
margin-bottom: $baseline;
font: inherit;
color: inherit;
}
} }
// Choice Group - silent class // Choice Group - silent class
......
...@@ -2,43 +2,27 @@ ...@@ -2,43 +2,27 @@
metadata: metadata:
display_name: Checkboxes display_name: Checkboxes
markdown: | markdown: |
Checkbox problems allow learners to select multiple options. Learners can see all the options along with the problem text. You can use this template as a guide to the simple editor markdown and OLX markup to use for checkboxes problems. Edit this component to replace this template with your own assessment.
When you add the problem, be sure to select Settings to specify a Display Name and other values that apply. >>Add the question text, or prompt, here. This text is required.||You can add an optional tip or note related to the prompt like this. <<
You can use the following example problem as a model. [x] a correct answer
[ ] an incorrect answer
>>The following languages are in the Indo-European family:||Make sure you select all of the correct options—there may be more than one!<< [ ] an incorrect answer
[x] Urdu [x] a correct answer
[ ] Finnish
[x] Marathi
[x] French
[ ] Hungarian
[explanation]
Urdu, Marathi, and French are all Indo-European languages, while Finnish and Hungarian are in the Uralic family.
[explanation]
data: | data: |
<problem> <problem>
<choiceresponse> <choiceresponse>
<p>Checkbox problems allow learners to select multiple options. Learners can see all the options along with the problem text.</p> <p>You can use this template as a guide to the simple editor markdown and OLX markup to use for checkboxes problems. Edit this component to replace this template with your own assessment.</p>
<p>When you add the problem, be sure to select Settings to specify a Display Name and other values that apply.</p> <label>Add the question text, or prompt, here. This text is required.</label>
<p>You can use the following example problem as a model.</p> <description>You can add an optional tip or note related to the prompt like this.</description>
<label>The following languages are in the Indo-European family:</label>
<description>Make sure you select all of the correct options—there may be more than one!</description>
<checkboxgroup> <checkboxgroup>
<choice correct="true">Urdu</choice> <choice correct="true">a correct answer</choice>
<choice correct="false">Finnish</choice> <choice correct="false">an incorrect answer</choice>
<choice correct="true">Marathi</choice> <choice correct="false">an incorrect answer</choice>
<choice correct="true">French</choice> <choice correct="true">a correct answer</choice>
<choice correct="false">Hungarian</choice>
</checkboxgroup> </checkboxgroup>
<solution>
<div class="detailed-solution">
<p>Explanation</p>
<p>Urdu, Marathi, and French are all Indo-European languages, while Finnish and Hungarian are in the Uralic family.</p>
</div>
</solution>
</choiceresponse> </choiceresponse>
</problem> </problem>
...@@ -3,65 +3,50 @@ metadata: ...@@ -3,65 +3,50 @@ metadata:
display_name: Checkboxes with Hints and Feedback display_name: Checkboxes with Hints and Feedback
markdown: | markdown: |
You can provide feedback for each option in a checkbox problem, with distinct feedback depending on whether or not the learner selects that option. You can use this template as a guide to the simple editor markdown and OLX markup to use for checkboxes with hints and feedback problems. Edit this component to replace this template with your own assessment.
You can also provide compound feedback for a specific combination of answers. For example, if you have three possible answers in the problem, you can configure specific feedback for when a learner selects each combination of possible answers. >>Add the question text, or prompt, here. This text is required.||You can add an optional tip or note related to the prompt like this.<<
You can also add hints for learners. [x] a correct answer {{ selected: You can specify optional feedback that appears after the learner selects and submits this answer. }, { unselected: You can specify optional feedback that appears after the learner clears and submits this answer.}}
[ ] an incorrect answer
[ ] an incorrect answer {{ selected: You can specify optional feedback for none, all, or a subset of the answers. }, { unselected: You can specify optional feedback for selected answers, cleared answers, or both.}}
[x] a correct answer
Be sure to select Settings to specify a Display Name and other values that apply.
Use the following example problem as a model. {{ ((A B D)) You can specify optional feedback for a combination of answers which appears after the specified set of answers is submitted. }}
{{ ((A B C D)) You can specify optional feedback for one, several, or all answer combinations. }}
>>Which of the following is a fruit?||Make sure you select all of the correct options—there may be more than one!<< ||You can add an optional hint like this. Problems that have a hint include a hint button, and this text appears the first time learners select the button.||
||If you add more than one hint, a different hint appears each time learners select the hint button.||
[x] apple {{ selected: You are correct that an apple is a fruit because it is the fertilized ovary that comes from an apple tree and contains seeds. }, { unselected: Remember that an apple is also a fruit.}}
[x] pumpkin {{ selected: You are correct that a pumpkin is a fruit because it is the fertilized ovary of a squash plant and contains seeds. }, { unselected: Remember that a pumpkin is also a fruit.}}
[ ] potato {{ U: You are correct that a potato is a vegetable because it is an edible part of a plant in tuber form.}, { S: A potato is a vegetable, not a fruit, because it does not come from a flower and does not contain seeds.}}
[x] tomato {{ S: You are correct that a tomato is a fruit because it is the fertilized ovary of a tomato plant and contains seeds. }, { U: Many people mistakenly think a tomato is a vegetable. However, because a tomato is the fertilized ovary of a tomato plant and contains seeds, it is a fruit.}}
{{ ((A B D)) An apple, pumpkin, and tomato are all fruits as they all are fertilized ovaries of a plant and contain seeds. }}
{{ ((A B C D)) You are correct that an apple, pumpkin, and tomato are all fruits as they all are fertilized ovaries of a plant and contain seeds. However, a potato is not a fruit as it is an edible part of a plant in tuber form and is a vegetable. }}
||A fruit is the fertilized ovary from a flower.||
||A fruit contains seeds of the plant.||
hinted: true hinted: true
data: | data: |
<problem> <problem>
<choiceresponse> <choiceresponse>
<p>You can provide feedback for each option in a checkbox problem, with distinct feedback depending on whether or not the learner selects that option.</p> <p>You can use this template as a guide to the simple editor markdown and OLX markup to use for checkboxes with hints and feedback problems. Edit this component to replace this template with your own assessment.</p>
<p>You can also provide compound feedback for a specific combination of answers. For example, if you have three possible answers in the problem, you can configure specific feedback for when a learner selects each combination of possible answers.</p> <label>Add the question text, or prompt, here. This text is required.</label>
<p>You can also add hints for learners.</p> <description>You can add an optional tip or note related to the prompt like this.</description>
<p>Be sure to select Settings to specify a Display Name and other values that apply.</p>
<p>Use the following example problem as a model.</p>
<label>Which of the following is a fruit?</label>
<description>Make sure you select all of the correct options—there may be more than one!</description>
<checkboxgroup> <checkboxgroup>
<choice correct="true">apple <choice correct="true">a correct answer
<choicehint selected="true">You are correct that an apple is a fruit because it is the fertilized ovary that comes from an apple tree and contains seeds.</choicehint> <choicehint selected="true">You can specify optional feedback that appears after the learner selects and submits this answer.</choicehint>
<choicehint selected="false">Remember that an apple is also a fruit.</choicehint> <choicehint selected="false">You can specify optional feedback that appears after the learner clears and submits this answer.</choicehint>
</choice> </choice>
<choice correct="true">pumpkin <choice correct="false">an incorrect answer
<choicehint selected="true">You are correct that a pumpkin is a fruit because it is the fertilized ovary of a squash plant and contains seeds.</choicehint>
<choicehint selected="false">Remember that a pumpkin is also a fruit.</choicehint>
</choice> </choice>
<choice correct="false">potato <choice correct="false">an incorrect answer
<choicehint selected="true">A potato is a vegetable, not a fruit, because it does not come from a flower and does not contain seeds.</choicehint> <choicehint selected="true">You can specify optional feedback for none, all, or a subset of the answers.</choicehint>
<choicehint selected="false">You are correct that a potato is a vegetable because it is an edible part of a plant in tuber form.</choicehint> <choicehint selected="false">You can specify optional feedback for selected answers, cleared answers, or both.</choicehint>
</choice> </choice>
<choice correct="true">tomato <choice correct="true">a correct answer
<choicehint selected="true">You are correct that a tomato is a fruit because it is the fertilized ovary of a tomato plant and contains seeds.</choicehint>
<choicehint selected="false">Many people mistakenly think a tomato is a vegetable. However, because a tomato is the fertilized ovary of a tomato plant and contains seeds, it is a fruit.</choicehint>
</choice> </choice>
<compoundhint value="A B D">An apple, pumpkin, and tomato are all fruits as they all are fertilized ovaries of a plant and contain seeds.</compoundhint> <compoundhint value="A B D">You can specify optional feedback for a combination of answers which appears after the specified set of answers is submitted.</compoundhint>
<compoundhint value="A B C D">You are correct that an apple, pumpkin, and tomato are all fruits as they all are fertilized ovaries of a plant and contain seeds. However, a potato is not a fruit as it is an edible part of a plant in tuber form and is a vegetable.</compoundhint> <compoundhint value="A B C D">You can specify optional feedback for one, several, or all answer combinations.</compoundhint>
</checkboxgroup> </checkboxgroup>
</choiceresponse> </choiceresponse>
<demandhint> <demandhint>
<hint>A fruit is the fertilized ovary from a flower.</hint> <hint>You can add an optional hint like this. Problems that have a hint include a hint button, and this text appears the first time learners select the button.</hint>
<hint>A fruit contains seeds of the plant.</hint> <hint>If you add more than one hint, a different hint appears each time learners select the hint button.</hint>
</demandhint> </demandhint>
</problem> </problem>
...@@ -2,51 +2,26 @@ ...@@ -2,51 +2,26 @@
metadata: metadata:
display_name: Multiple Choice display_name: Multiple Choice
markdown: | markdown: |
Multiple choice problems allow learners to select only one option. Learners can see all the options along with the problem text.
When you add the problem, be sure to select Settings to specify a Display Name and other values that apply. You can use this template as a guide to the simple editor markdown and OLX markup to use for multiple choice problems. Edit this component to replace this template with your own assessment.
You can use the following example problem as a model. >>Add the question text, or prompt, here. This text is required.||You can add an optional tip or note related to the prompt like this. <<
>>Which of the following countries has the largest population?||You can select only one option.<< ( ) an incorrect answer
( ) Brazil {{ timely feedback -- explain why an almost correct answer is wrong }} (x) the correct answer
( ) Germany ( ) an incorrect answer
(x) Indonesia
( ) Russia
[explanation]
According to September 2014 estimates:
The population of Indonesia is approximately 250 million.
The population of Brazil is approximately 200 million.
The population of Russia is approximately 146 million.
The population of Germany is approximately 81 million.
[explanation]
data: | data: |
<problem> <problem>
<multiplechoiceresponse> <multiplechoiceresponse>
<p>Multiple choice problems allow learners to select only one option. Learners can see all the options along with the problem text.</p> <p>You can use this template as a guide to the simple editor markdown and OLX markup to use for multiple choice problems. Edit this component to replace this template with your own assessment.</p>
<p>When you add the problem, be sure to select Settings to specify a Display Name and other values that apply.</p> <label>Add the question text, or prompt, here. This text is required.</label>
<p>You can use the following example problem as a model.</p> <description>You can add an optional tip or note related to the prompt like this.</description>
<label>Which of the following countries has the largest population?</label> <choicegroup>
<description>You can select only one option.</description> <choice correct="false">an incorrect answer</choice>
<choicegroup type="MultipleChoice"> <choice correct="true">the correct answer</choice>
<choice correct="false">Brazil <choice correct="false">an incorrect answer</choice>
<choicehint>timely feedback -- explain why an almost correct answer is wrong</choicehint> </choicegroup>
</choice> </multiplechoiceresponse>
<choice correct="false">Germany</choice>
<choice correct="true">Indonesia</choice>
<choice correct="false">Russia</choice>
</choicegroup>
<solution>
<div class="detailed-solution">
<p>Explanation</p>
<p>According to September 2014 estimates:</p>
<p>The population of Indonesia is approximately 250 million.</p>
<p>The population of Brazil is approximately 200 million.</p>
<p>The population of Russia is approximately 146 million.</p>
<p>The population of Germany is approximately 81 million.</p>
</div>
</solution>
</multiplechoiceresponse>
</problem> </problem>
...@@ -3,51 +3,38 @@ metadata: ...@@ -3,51 +3,38 @@ metadata:
display_name: Multiple Choice with Hints and Feedback display_name: Multiple Choice with Hints and Feedback
markdown: | markdown: |
You can provide feedback for each option in a multiple choice problem. You can use this template as a guide to the simple editor markdown and OLX markup to use for multiple choice with hints and feedback problems. Edit this component to replace this template with your own assessment.
You can also add hints for learners. >>Add the question text, or prompt, here. This text is required.||You can add an optional tip or note related to the prompt like this. <<
Be sure to select Settings to specify a Display Name and other values that apply. ( ) an incorrect answer {{You can specify optional feedback like this, which appears after this answer is submitted.}}
(x) the correct answer
( ) an incorrect answer {{You can specify optional feedback for none, a subset, or all of the answers.}}
Use the following example problem as a model. ||You can add an optional hint like this. Problems that have a hint include a hint button, and this text appears the first time learners select the button.||
||If you add more than one hint, a different hint appears each time learners select the hint button.||
>>Which of the following is a vegetable?||You can select only one option.<<
( ) apple {{An apple is the fertilized ovary that comes from an apple tree and contains seeds, meaning it is a fruit.}}
( ) pumpkin {{A pumpkin is the fertilized ovary of a squash plant and contains seeds, meaning it is a fruit.}}
(x) potato {{A potato is an edible part of a plant in tuber form and is a vegetable.}}
( ) tomato {{Many people mistakenly think a tomato is a vegetable. However, because a tomato is the fertilized ovary of a tomato plant and contains seeds, it is a fruit.}}
||A fruit is the fertilized ovary from a flower.||
||A fruit contains seeds of the plant.||
hinted: true hinted: true
data: | data: |
<problem> <problem>
<multiplechoiceresponse> <multiplechoiceresponse>
<p>You can provide feedback for each option in a multiple choice problem.</p> <p>You can use this template as a guide to the simple editor markdown and OLX markup to use for multiple choice with hints and feedback problems. Edit this component to replace this template with your own assessment.</p>
<p>You can also add hints for learners.</p> <label>Add the question text, or prompt, here. This text is required.</label>
<p>Be sure to select Settings to specify a Display Name and other values that apply.</p> <description>You can add an optional tip or note related to the prompt like this.</description>
<p>Use the following example problem as a model.</p>
<label>Which of the following is a vegetable?</label>
<description>You can select only one option.</description>
<choicegroup> <choicegroup>
<choice correct="false">apple <choice correct="false">an incorrect answer
<choicehint>An apple is the fertilized ovary that comes from an apple tree and contains seeds, meaning it is a fruit.</choicehint> <choicehint>You can specify optional feedback like this, which appears after this answer is submitted.</choicehint>
</choice>
<choice correct="false">pumpkin
<choicehint>A pumpkin is the fertilized ovary of a squash plant and contains seeds, meaning it is a fruit.</choicehint>
</choice> </choice>
<choice correct="true">potato <choice correct="true">the correct answer
<choicehint>A potato is an edible part of a plant in tuber form and is a vegetable.</choicehint>
</choice> </choice>
<choice correct="false">tomato <choice correct="false">an incorrect answer
<choicehint>Many people mistakenly think a tomato is a vegetable. However, because a tomato is the fertilized ovary of a tomato plant and contains seeds, it is a fruit.</choicehint> <choicehint>You can specify optional feedback for none, a subset, or all of the answers.</choicehint>
</choice> </choice>
</choicegroup> </choicegroup>
</multiplechoiceresponse> </multiplechoiceresponse>
<demandhint> <demandhint>
<hint>A fruit is the fertilized ovary from a flower.</hint> <hint>You can add an optional hint like this. Problems that have a hint include a hint button, and this text appears the first time learners select the button.</hint>
<hint>A fruit contains seeds of the plant.</hint> <hint>If you add more than one hint, a different hint appears each time learners select the hint button.</hint>
</demandhint> </demandhint>
</problem> </problem>
...@@ -2,33 +2,23 @@ ...@@ -2,33 +2,23 @@
metadata: metadata:
display_name: Dropdown display_name: Dropdown
markdown: | markdown: |
Dropdown problems allow learners to select only one option from a list of options. You can use this template as a guide to the simple editor markdown and OLX markup to use for dropdown problems. Edit this component to replace this template with your own assessment.
>>Add the question text, or prompt, here. This text is required.||You can add an optional tip or note related to the prompt like this. <<
When you add the problem, be sure to select Settings to specify a Display Name and other values that apply. [[
an incorrect answer
You can use the following example problem as a model. (the correct answer)
an incorrect answer
>>Which of the following countries celebrates its independence on August 15?||You can select only one option.<< ]]
[[(India), Spain, China, Bermuda]]
[explanation]
India became an independent nation on August 15, 1947.
[explanation]
data: | data: |
<problem> <problem>
<optionresponse> <optionresponse>
<p>Dropdown problems allow learners to select only one option from a list of options.</p> <p>You can use this template as a guide to the simple editor markdown and OLX markup to use for dropdown problems. Edit this component to replace this template with your own assessment.</p>
<p>When you add the problem, be sure to select Settings to specify a Display Name and other values that apply.</p> <label>Add the question text, or prompt, here. This text is required.</label>
<p>You can use the following example problem as a model.</p> <description>You can add an optional tip or note related to the prompt like this. </description>
<label>Which of the following countries celebrates its independence on August 15?</label> <optioninput>
<description>You can select only one option.</description> <option correct="False">an incorrect answer</option>
<optioninput options="('India','Spain','China','Bermuda')" correct="India"/> <option correct="True">the correct answer</option>
<solution> <option correct="False">an incorrect answer</option>
<div class="detailed-solution"> </optioninput>
<p>Explanation</p>
<p>India became an independent nation on August 15, 1947.</p>
</div>
</solution>
</optionresponse> </optionresponse>
</problem> </problem>
...@@ -2,55 +2,34 @@ ...@@ -2,55 +2,34 @@
metadata: metadata:
display_name: Dropdown with Hints and Feedback display_name: Dropdown with Hints and Feedback
markdown: | markdown: |
You can use this template as a guide to the simple editor markdown and OLX markup to use for dropdown with hints and feedback problems. Edit this component to replace this template with your own assessment.
You can provide feedback for each available option in a dropdown problem. >>Add the question text, or prompt, here. This text is required.||You can add an optional tip or note related to the prompt
like this. <<
You can also add hints for learners.
Be sure to select Settings to specify a Display Name and other values that apply.
Use the following example problem as a model.
>> A/an ________ is a vegetable.||You can select only one option.<<
[[ [[
apple {{An apple is the fertilized ovary that comes from an apple tree and contains seeds, meaning it is a fruit.}} an incorrect answer {{You can specify optional feedback like this, which appears after this answer is submitted.}}
pumpkin {{A pumpkin is the fertilized ovary of a squash plant and contains seeds, meaning it is a fruit.}} (the correct answer)
(potato) {{A potato is an edible part of a plant in tuber form and is a vegetable.}} an incorrect answer {{You can specify optional feedback for none, a subset, or all of the answers.}}
tomato {{Many people mistakenly think a tomato is a vegetable. However, because a tomato is the fertilized ovary of a tomato plant and contains seeds, it is a fruit.}}
]] ]]
||A fruit is the fertilized ovary from a flower.|| ||You can add an optional hint like this. Problems that have a hint include a hint button, and this text appears the first time learners select the button.||
||A fruit contains seeds of the plant.|| ||If you add more than one hint, a different hint appears each time learners select the hint button.||
hinted: true hinted: true
data: | data: |
<problem> <problem>
<optionresponse> <optionresponse>
<p>You can provide feedback for each available option in a dropdown problem.</p> <p>You can use this template as a guide to the simple editor markdown and OLX markup to use for dropdown with hints and feedback problems. Edit this component to replace this template with your own assessment.</p>
<p>You can also add hints for learners.</p> <label>Add the question text, or prompt, here. This text is required.</label>
<p>Be sure to select Settings to specify a Display Name and other values that apply.</p> <description>You can add an optional tip or note related to the prompt
<p>Use the following example problem as a model.</p> like this. </description>
<label>A/an ________ is a vegetable.</label>
<description>You can select only one option.</description>
<optioninput> <optioninput>
<option correct="False">apple <option correct="False">an incorrect answer <optionhint>You can specify optional feedback like this, which appears after this answer is submitted.</optionhint></option>
<optionhint>An apple is the fertilized ovary that comes from an apple tree and contains seeds, meaning it is a fruit.</optionhint> <option correct="True">the correct answer</option>
</option> <option correct="False">an incorrect answer <optionhint>You can specify optional feedback for none, a subset, or all of the answers.</optionhint></option>
<option correct="False">pumpkin
<optionhint>A pumpkin is the fertilized ovary of a squash plant and contains seeds, meaning it is a fruit.</optionhint>
</option>
<option correct="True">potato
<optionhint>A potato is an edible part of a plant in tuber form and is a vegetable.</optionhint>
</option>
<option correct="False">tomato
<optionhint>Many people mistakenly think a tomato is a vegetable. However, because a tomato is the fertilized ovary of a tomato plant and contains seeds, it is a fruit.</optionhint>
</option>
</optioninput> </optioninput>
</optionresponse> </optionresponse>
<demandhint> <demandhint>
<hint>A fruit is the fertilized ovary from a flower.</hint> <hint>You can add an optional hint like this. Problems that have a hint include a hint button, and this text appears the first time learners select the button.</hint>
<hint>A fruit contains seeds of the plant.</hint> <hint>If you add more than one hint, a different hint appears each time learners select the hint button.</hint>
</demandhint> </demandhint>
</problem> </problem>
...@@ -2,26 +2,20 @@ ...@@ -2,26 +2,20 @@
metadata: metadata:
display_name: Text Input display_name: Text Input
markdown: | markdown: |
You can use this template as a guide to the simple editor markdown and OLX markup to use for text input with You can use this template as a guide to the simple editor markdown and OLX markup to use for text input problems. Edit this component to replace this template with your own assessment.
hints and feedback problems. Edit this component to replace this template with your own assessment.
>>Add the question text, or prompt, here. This text is required.||You can add an optional tip or note related >>Add the question text, or prompt, here. This text is required.||You can add an optional tip or note related to the prompt like this. <<
to the prompt like this. <<
= the correct answer {{You can specify optional feedback like this, which appears after this answer is submitted.}} = the correct answer
or= optional acceptable variant of the correct answer or= optional acceptable variant of the correct answer
not= optional incorrect answer such as a frequent misconception {{You can specify optional feedback for none, a subset, or all of the answers.}}
data: | data: |
<problem> <problem>
<stringresponse answer="the correct answer" type="ci"> <stringresponse answer="the correct answer" type="ci">
<p>You can use this template as a guide to the simple editor markdown and OLX markup to use for text input with</p> <p>You can use this template as a guide to the simple editor markdown and OLX markup to use for text input problems. Edit this component to replace this template with your own assessment.</p>
<p>hints and feedback problems. Edit this component to replace this template with your own assessment.</p>
<label>Add the question text, or prompt, here. This text is required.</label> <label>Add the question text, or prompt, here. This text is required.</label>
<description>You can add an optional tip or note related to the prompt like this.</description> <description>You can add an optional tip or note related to the prompt like this.</description>
<correcthint>You can specify optional feedback like this, which appears after this answer is submitted.</correcthint>
<additional_answer answer="optional acceptable variant of the correct answer"/> <additional_answer answer="optional acceptable variant of the correct answer"/>
<stringequalhint answer="optional incorrect answer such as a frequent misconception">You can specify optional feedback for none, a subset, or all of the answers.</stringequalhint>
<textline size="20"/> <textline size="20"/>
</stringresponse> </stringresponse>
</problem> </problem>
...@@ -535,3 +535,29 @@ class ProblemTextInputA11yTest(CAPAProblemA11yBaseTestMixin, ProblemsTest): ...@@ -535,3 +535,29 @@ class ProblemTextInputA11yTest(CAPAProblemA11yBaseTestMixin, ProblemsTest):
</stringresponse> </stringresponse>
</problem>""") </problem>""")
return XBlockFixtureDesc('problem', 'TEXTINPUT PROBLEM', data=xml) return XBlockFixtureDesc('problem', 'TEXTINPUT PROBLEM', data=xml)
@attr('a11y')
class CAPAProblemDropDownA11yTest(CAPAProblemA11yBaseTestMixin, ProblemsTest):
"""TestCase Class to verify accessibility for dropdowns(optioninput) CAPA problems."""
def get_problem(self):
"""
Problem structure.
"""
xml = dedent("""
<problem>
<optionresponse>
<p>You can use this template as a guide to the simple editor markdown and OLX markup to use for
dropdown problems. Edit this component to replace this template with your own assessment.</p>
<label>Which of the following is a fruit</label>
<description>Choose wisely</description>
<optioninput>
<option correct="False">radish</option>
<option correct="True">appple</option>
<option correct="False">carrot</option>
</optioninput>
</optionresponse>
</problem>
""")
return XBlockFixtureDesc('problem', 'Problem A11Y TEST', data=xml)
...@@ -462,12 +462,6 @@ class DropDownProblemTypeTest(ProblemTypeTestBase, ProblemTypeTestMixin): ...@@ -462,12 +462,6 @@ class DropDownProblemTypeTest(ProblemTypeTestBase, ProblemTypeTestMixin):
Additional setup for DropDownProblemTypeTest Additional setup for DropDownProblemTypeTest
""" """
super(DropDownProblemTypeTest, self).setUp(*args, **kwargs) super(DropDownProblemTypeTest, self).setUp(*args, **kwargs)
self.problem_page.a11y_audit.config.set_rules({
'ignore': [
'section', # TODO: AC-491
'label', # TODO: AC-291
]
})
def answer_problem(self, correct): def answer_problem(self, correct):
""" """
......
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