diff --git a/common/lib/xmodule/xmodule/js/fixtures/problem_content.html b/common/lib/xmodule/xmodule/js/fixtures/problem_content.html
index 10354f74fc..dcc0a31491 100644
--- a/common/lib/xmodule/xmodule/js/fixtures/problem_content.html
+++ b/common/lib/xmodule/xmodule/js/fixtures/problem_content.html
@@ -12,9 +12,9 @@
-
-
-
+
+
+
Explanation
diff --git a/common/lib/xmodule/xmodule/js/spec/capa/display_spec.coffee b/common/lib/xmodule/xmodule/js/spec/capa/display_spec.coffee
index 407854d876..892864f631 100644
--- a/common/lib/xmodule/xmodule/js/spec/capa/display_spec.coffee
+++ b/common/lib/xmodule/xmodule/js/spec/capa/display_spec.coffee
@@ -54,19 +54,19 @@ describe 'Problem', ->
expect(window.update_schematics).toHaveBeenCalled()
it 'bind answer refresh on button click', ->
- expect($('div.action input:button')).toHandleWith 'click', @problem.refreshAnswers
+ expect($('div.action button')).toHandleWith 'click', @problem.refreshAnswers
it 'bind the check button', ->
- expect($('div.action input.check')).toHandleWith 'click', @problem.check_fd
+ expect($('div.action button.check')).toHandleWith 'click', @problem.check_fd
it 'bind the reset button', ->
- expect($('div.action input.reset')).toHandleWith 'click', @problem.reset
+ expect($('div.action button.reset')).toHandleWith 'click', @problem.reset
it 'bind the show button', ->
expect($('div.action button.show')).toHandleWith 'click', @problem.show
it 'bind the save button', ->
- expect($('div.action input.save')).toHandleWith 'click', @problem.save
+ expect($('div.action button.save')).toHandleWith 'click', @problem.save
it 'bind the math input', ->
expect($('input.math')).toHandleWith 'keyup', @problem.refreshMath
@@ -86,7 +86,7 @@ describe 'Problem', ->
$(@).html readFixtures('problem_content_1240.html')
it 'bind the check button', ->
- expect($('div.action input.check')).toHandleWith 'click', @problem.check_fd
+ expect($('div.action button.check')).toHandleWith 'click', @problem.check_fd
it 'bind the show button', ->
expect($('div.action button.show')).toHandleWith 'click', @problem.show
diff --git a/common/lib/xmodule/xmodule/js/src/capa/display.coffee b/common/lib/xmodule/xmodule/js/src/capa/display.coffee
index f5f8ff8668..93c792b502 100644
--- a/common/lib/xmodule/xmodule/js/src/capa/display.coffee
+++ b/common/lib/xmodule/xmodule/js/src/capa/display.coffee
@@ -26,14 +26,15 @@ class @Problem
problem_prefix = @element_id.replace(/problem_/,'')
@inputs = @$("[id^='input_#{problem_prefix}_']")
- @$('div.action input:button').click @refreshAnswers
- @checkButton = @$('div.action input.check')
- @checkButtonCheckText = @checkButton.val()
+ @$('div.action button').click @refreshAnswers
+ @checkButton = @$('div.action button.check')
+ @checkButtonLabel = @$('div.action button.check span.check-label')
+ @checkButtonCheckText = @checkButtonLabel.text()
@checkButtonCheckingText = @checkButton.data('checking')
@checkButton.click @check_fd
- @$('div.action input.reset').click @reset
+ @$('div.action button.reset').click @reset
@$('div.action button.show').click @show
- @$('div.action input.save').click @save
+ @$('div.action button.save').click @save
# Accessibility helper for sighted keyboard users to show tooltips on focus:
@$('.clarification').focus (ev) =>
icon = $(ev.target).children "i"
@@ -315,7 +316,7 @@ class @Problem
@updateProgress response
if @el.hasClass 'showed'
@el.removeClass 'showed'
- @$('div.action input.check').focus()
+ @$('div.action button.check').focus()
else
@gentle_alert response.success
Logger.log 'problem_graded', [@answers, response.contents], @id
@@ -680,11 +681,11 @@ class @Problem
if enable
@checkButton.removeClass 'is-disabled'
@checkButton.attr({'aria-disabled': 'false'})
- @checkButton.val(@checkButtonCheckText)
+ @checkButtonLabel.text(@checkButtonCheckText)
else
@checkButton.addClass 'is-disabled'
@checkButton.attr({'aria-disabled': 'true'})
- @checkButton.val(@checkButtonCheckingText)
+ @checkButtonLabel.text(@checkButtonCheckingText)
enableCheckButtonAfterResponse: =>
@has_response = true
diff --git a/common/test/acceptance/pages/lms/problem.py b/common/test/acceptance/pages/lms/problem.py
index 239dff45de..5ba10d980c 100644
--- a/common/test/acceptance/pages/lms/problem.py
+++ b/common/test/acceptance/pages/lms/problem.py
@@ -38,7 +38,7 @@ class ProblemPage(PageObject):
"""
Click the Check button!
"""
- self.q(css='div.problem input.check').click()
+ self.q(css='div.problem button.check').click()
self.wait_for_ajax()
def is_correct(self):
diff --git a/lms/djangoapps/courseware/features/conditional.py b/lms/djangoapps/courseware/features/conditional.py
index 2fab88f253..7515c69adc 100644
--- a/lms/djangoapps/courseware/features/conditional.py
+++ b/lms/djangoapps/courseware/features/conditional.py
@@ -74,7 +74,7 @@ class ConditionalSteps(object):
if not_attempted is None:
answer_problem(self.COURSE_NUM, 'string', True)
- world.css_click("input.check")
+ world.css_click("button.check")
def when_i_view_the_conditional(self, step):
r'I view the conditional$'
diff --git a/lms/djangoapps/courseware/features/problems.py b/lms/djangoapps/courseware/features/problems.py
index 40ac5f790e..bdf2d9e3f3 100644
--- a/lms/djangoapps/courseware/features/problems.py
+++ b/lms/djangoapps/courseware/features/problems.py
@@ -92,7 +92,7 @@ def check_problem(step):
# first scroll down so the loading mathjax button does not
# cover up the Check button
world.browser.execute_script("window.scrollTo(0,1024)")
- world.css_click("input.check")
+ world.css_click("button.check")
# Wait for the problem to finish re-rendering
world.wait_for_ajax_complete()
@@ -115,7 +115,7 @@ def assert_problem_has_answer(step, problem_type, answer_class):
@step(u'I reset the problem')
def reset_problem(_step):
- world.css_click('input.reset')
+ world.css_click('button.reset')
# Wait for the problem to finish re-rendering
world.wait_for_ajax_complete()
@@ -131,7 +131,7 @@ def press_the_button_with_label(_step, buttonname):
@step(u'The "([^"]*)" button does( not)? appear')
def action_button_present(_step, buttonname, doesnt_appear):
- button_css = 'div.action input[value*="%s"]' % buttonname
+ button_css = 'div.action button[data-value*="%s"]' % buttonname
if bool(doesnt_appear):
assert world.is_css_not_present(button_css)
else:
diff --git a/lms/templates/problem.html b/lms/templates/problem.html
index 2a7d646d6a..863a85e9ce 100644
--- a/lms/templates/problem.html
+++ b/lms/templates/problem.html
@@ -14,13 +14,13 @@
% if check_button:
-
+
% endif
% if reset_button:
-
+
% endif
% if save_button:
-
+
% endif
% if answer_available: