Skip to content

Commit d2dc4bb

Browse files
author
Korshenko, Olexii(okorshenko)
committed
Merge pull request #640 from magento-webdev/PR
[WebDev] Accessibility Improvements + Bufixes
2 parents 26be84a + cb804b8 commit d2dc4bb

File tree

28 files changed

+133
-67
lines changed

28 files changed

+133
-67
lines changed

app/code/Magento/Backend/Block/Store/Switcher.php

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -548,11 +548,11 @@ public function getHintHtml()
548548
$html = '';
549549
$url = $this->getHintUrl();
550550
if ($url) {
551-
$html = '<div class="tooltip">' . '<span class="help"><a' . ' href="' . $this->escapeUrl(
551+
$html = '<div class="admin__field-tooltip tooltip">' . '<a' . ' href="' . $this->escapeUrl(
552552
$url
553553
) . '"' . ' onclick="this.target=\'_blank\'"' . ' title="' . __(
554554
'What is this?'
555-
) . '"' . ' class="link-store-scope"><span>' . __(
555+
) . '"' . ' class="admin__field-tooltip-action action-help"><span>' . __(
556556
'What is this?'
557557
) . '</span></a></span>' . ' </div>';
558558
}

app/code/Magento/Backend/view/adminhtml/templates/store/switcher/form/renderer/fieldset.phtml

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -13,13 +13,13 @@
1313
<?php endif; ?>
1414

1515
<?php if (!$_element->getNoContainer()): ?>
16-
<fieldset class="fieldset <?php /* @escapeNotVerified */ echo $_element->getClass() ?>" id="<?php echo $_element->getHtmlId() ?>">
16+
<fieldset class="admin__fieldset fieldset <?php /* @escapeNotVerified */ echo $_element->getClass() ?>" id="<?php echo $_element->getHtmlId() ?>">
1717
<?php endif; ?>
1818

1919
<?php if ($_element->getLegend()): ?>
20-
<legend class="legend">
20+
<legend class="admin__legend legend">
2121
<span><?php /* @escapeNotVerified */ echo $_element->getLegend() ?></span>
22-
</legend>
22+
</legend><br/>
2323
<?php /* @escapeNotVerified */ echo $_element->getHeaderBar() ?>
2424
<?php endif; ?>
2525
<?php echo $block->getHintHtml() ?>

app/code/Magento/Backend/view/adminhtml/templates/store/switcher/form/renderer/fieldset/element.phtml

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -14,10 +14,10 @@ $note = $element->getNote() ? '<div class="note">' . $element->getNote() . '</di
1414
$elementBeforeLabel = $element->getExtType() == 'checkbox' || $element->getExtType() == 'radio';
1515
$addOn = $element->getBeforeElementHtml() || $element->getAfterElementHtml();
1616
$fieldId = ($element->getHtmlContainerId()) ? ' id="' . $element->getHtmlContainerId() . '"' : '';
17-
$fieldClass = "field field-{$element->getId()} {$element->getCssClass()}";
17+
$fieldClass = "admin__field field field-{$element->getId()} {$element->getCssClass()}";
1818
$fieldClass .= ($elementBeforeLabel) ? ' choice' : '';
1919
$fieldClass .= ($addOn) ? ' with-addon' : '';
20-
$fieldClass .= ($element->getRequired()) ? ' required' : '';
20+
$fieldClass .= ($element->getRequired()) ? ' _required' : '';
2121
$fieldClass .= ($note) ? ' with-note' : '';
2222

2323
$fieldAttributes = $fieldId . ' class="' . $fieldClass . '" '
@@ -35,16 +35,16 @@ $fieldAttributes = $fieldId . ' class="' . $fieldClass . '" '
3535
<?php /* @escapeNotVerified */ echo $note ?>
3636
<?php else: ?>
3737
<?php echo $element->getLabelHtml() ?>
38-
<div class="control">
38+
<div class="admin__field-control control">
3939
<?php /* @escapeNotVerified */ echo($addOn) ? '<div class="addon">' . $element->getElementHtml() . '</div>' : $element->getElementHtml(); ?>
40+
<?php echo $block->getHintHtml() ?>
4041
<?php /* @escapeNotVerified */ echo $note ?>
4142
</div>
4243
<?php endif; ?>
4344
<?php if ($element->getScopeLabel()): ?>
4445
<div class="field-service" value-scope="<?php /* @escapeNotVerified */ echo $element->getScopeLabel()?>">
4546
</div>
4647
<?php endif;?>
47-
<?php echo $block->getHintHtml() ?>
4848
</div>
4949
<?php endif; ?>
5050
<?php endif; ?>

app/code/Magento/Backend/view/adminhtml/templates/widget/form/renderer/fieldset.phtml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -57,7 +57,7 @@ if ($isField) {
5757
<?php if (!$element->getNoContainer()): ?>
5858
<fieldset class="<?php /* @escapeNotVerified */ echo $cssClass ?>" id="<?php /* @escapeNotVerified */ echo $id ?>">
5959
<?php if ($element->getLegend() && !$isWrapped): ?>
60-
<legend class="<?php /* @escapeNotVerified */ echo $isField ? 'label' : 'legend'?>">
60+
<legend class="<?php /* @escapeNotVerified */ echo $isField ? 'label admin__field-label' : 'admin__legend legend'?>">
6161
<span><?php /* @escapeNotVerified */ echo $element->getLegend() ?></span>
6262
</legend><br />
6363
<?php endif; ?>

app/code/Magento/Catalog/view/frontend/templates/product/view/addto.phtml

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -18,13 +18,11 @@ $compareHelper = $this->helper('Magento\Catalog\Helper\Product\Compare');
1818
<?php if ($this->helper('Magento\Wishlist\Helper\Data')->isAllow()) : ?>
1919
<a href="#"
2020
class="action towishlist"
21-
title="<?php /* @escapeNotVerified */ echo __('Add to Wish List') ?>"
2221
data-post='<?php /* @escapeNotVerified */ echo $_wishlistSubmitParams; ?>'
2322
data-action="add-to-wishlist"><span><?php /* @escapeNotVerified */ echo __('Add to Wish List') ?></span></a>
2423
<?php endif; ?>
2524
<a href="#" data-post='<?php /* @escapeNotVerified */ echo $compareHelper->getPostDataParams($_product);?>'
2625
data-role="add-to-links"
27-
title="<?php /* @escapeNotVerified */ echo __('Add to Compare') ?>"
2826
class="action tocompare"><span><?php /* @escapeNotVerified */ echo __('Add to Compare') ?></span></a>
2927
</div>
3028
<script type="text/x-magento-init">

app/code/Magento/Catalog/view/frontend/templates/product/view/addtocart.phtml

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@
1212
<?php $buttonTitle = __('Add to Cart'); ?>
1313
<?php if ($_product->isSaleable()): ?>
1414
<div class="box-tocart">
15-
<fieldset class="fieldset">
15+
<div class="fieldset">
1616
<?php if ($block->shouldRenderQuantity()): ?>
1717
<div class="field qty">
1818
<label class="label" for="qty"><span><?php /* @escapeNotVerified */ echo __('Qty') ?></span></label>
@@ -37,7 +37,7 @@
3737
</button>
3838
<?php echo $block->getChildHtml('', true) ?>
3939
</div>
40-
</fieldset>
40+
</div>
4141
</div>
4242
<?php endif; ?>
4343
<?php if ($block->isRedirectToCartEnabled()) : ?>

app/code/Magento/Catalog/view/frontend/templates/product/view/mailto.phtml

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,6 @@
99
?>
1010
<?php $_product = $block->getProduct() ?>
1111
<?php if ($block->canEmailToFriend()): ?>
12-
<a title="<?php /* @escapeNotVerified */ echo __('Email') ?>"
13-
href="<?php /* @escapeNotVerified */ echo $this->helper('Magento\Catalog\Helper\Product')->getEmailToFriendUrl($_product) ?>"
12+
<a href="<?php /* @escapeNotVerified */ echo $this->helper('Magento\Catalog\Helper\Product')->getEmailToFriendUrl($_product) ?>"
1413
class="action mailto friend"><span><?php /* @escapeNotVerified */ echo __('Email') ?></span></a>
1514
<?php endif; ?>

app/code/Magento/Catalog/view/frontend/templates/product/view/options/wrapper.phtml

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ if ($block->hasRequiredOptions()) {
1111
}
1212
?>
1313
<div class="product-options-wrapper" id="product-options-wrapper"<?php /* @escapeNotVerified */ echo $required; ?>>
14-
<fieldset class="fieldset" tabindex="0">
14+
<div class="fieldset" tabindex="0">
1515
<?php echo $block->getChildHtml('', true);?>
16-
</fieldset>
16+
</div>
1717
</div>

app/code/Magento/Checkout/view/frontend/templates/success.phtml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@
2222

2323
<div class="actions-toolbar">
2424
<div class="primary">
25-
<a class="action primary continue" title="<?php /* @escapeNotVerified */ echo __('Continue Shopping') ?>" href="<?php /* @escapeNotVerified */ echo $block->getUrl() ?>"><span><?php /* @escapeNotVerified */ echo __('Continue Shopping') ?></span></a>
25+
<a class="action primary continue" href="<?php /* @escapeNotVerified */ echo $block->getUrl() ?>"><span><?php /* @escapeNotVerified */ echo __('Continue Shopping') ?></span></a>
2626
</div>
2727
</div>
2828
</div>

app/code/Magento/Checkout/view/frontend/web/js/region-updater.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ define([
1515
$.widget('mage.regionUpdater', {
1616
options: {
1717
regionTemplate:
18-
'<option value="<%- data.value %>" title="<%- data.title %>" <% if (data.isSelected) { %>selected="selected"<% } %>>' +
18+
'<option value="<%- data.value %>" <% if (data.isSelected) { %>selected="selected"<% } %>>' +
1919
'<%- data.title %>' +
2020
'</option>',
2121
isRegionRequired: true,

app/code/Magento/Checkout/view/frontend/web/template/minicart/item/default.html

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@
2424
<div class="product-item-details">
2525
<strong class="product-item-name">
2626
<!-- ko if: product_has_url -->
27-
<a data-bind="attr: {href: product_url, title: product_name}, text: product_name"></a>
27+
<a data-bind="attr: {href: product_url}, text: product_name"></a>
2828
<!-- /ko -->
2929
<!-- ko ifnot: product_has_url -->
3030
<!-- ko text: product_name --><!-- /ko -->
@@ -69,7 +69,8 @@
6969
<!-- /ko -->
7070

7171
<div class="details-qty qty">
72-
<span class="label" data-bind="i18n: 'Qty'"></span>
72+
<label class="label" data-bind="i18n: 'Qty', attr: {
73+
for: 'cart-item-'+item_id+'-qty'}"></label>
7374
<input data-bind="attr: {
7475
id: 'cart-item-'+item_id+'-qty',
7576
'data-cart-item': item_id,

app/code/Magento/Checkout/view/frontend/web/template/payment.html

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,9 @@
1919
<form id="co-payment-form" class="form payments" novalidate="novalidate">
2020
<input data-bind='attr: {value: getFormKey()}' type="hidden" name="form_key"/>
2121
<fieldset class="fieldset">
22+
<legend class="legend">
23+
<span data-bind="i18n: 'Payment Information'"></span>
24+
</legend><br />
2225
<!-- ko foreach: getRegion('beforeMethods') -->
2326
<!-- ko template: getTemplate() --><!-- /ko -->
2427
<!-- /ko -->

app/code/Magento/Checkout/view/frontend/web/template/shipping-address/form.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
<!-- ko foreach: getRegion('before-fields') -->
99
<!-- ko template: getTemplate() --><!-- /ko -->
1010
<!--/ko-->
11-
<fieldset id="shipping-new-address-form" class="fieldset address">
11+
<div id="shipping-new-address-form" class="fieldset address">
1212
<!-- ko foreach: getRegion('additional-fieldsets') -->
1313
<!-- ko template: getTemplate() --><!-- /ko -->
1414
<!--/ko-->
@@ -20,5 +20,5 @@
2020
</label>
2121
</div>
2222
<!-- /ko -->
23-
</fieldset>
23+
</div>
2424
</form>

app/code/Magento/Checkout/view/frontend/web/template/shipping.html

Lines changed: 18 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -68,7 +68,7 @@
6868
<table class="table-checkout-shipping-method">
6969
<thead>
7070
<tr class="row">
71-
<th class="col">&nbsp;</th>
71+
<th class="col col-method" data-bind="i18n: 'Select Method'"></th>
7272
<th class="col col-price" data-bind="i18n: 'Price'"></th>
7373
<th class="col col-method" data-bind="i18n: 'Method Title'"></th>
7474
<th class="col col-carrier" data-bind="i18n: 'Carrier Title'"></th>
@@ -78,20 +78,28 @@
7878

7979
<!--ko foreach: { data: rates(), as: 'method'}-->
8080
<tr class="row" data-bind="click: $parent.selectShippingMethod">
81-
<td class="col">
81+
<td class="col col-method">
8282
<!-- ko ifnot: method.error_message -->
8383
<!-- ko if: $parent.rates().length == 1 -->
8484
<input name="shipping_method"
8585
class="radio"
8686
type="radio"
87-
data-bind="attr: {checked: $parent.rates().length == 1, 'value' : method.carrier_code + '_' + method.method_code, 'id': 's_method_' + method.method_code}" />
87+
data-bind="attr: {
88+
checked: $parent.rates().length == 1,
89+
'value' : method.carrier_code + '_' + method.method_code,
90+
'id': 's_method_' + method.method_code,
91+
'aria-labelledby': 'label_method_' + method.method_code + '_' + method.carrier_code + ' ' + 'label_carrier_' + method.method_code + '_' + method.carrier_code
92+
}" />
8893
<!-- /ko -->
8994
<!--ko ifnot: ($parent.rates().length == 1)-->
9095
<input name="shipping_method" type="radio"
9196
data-bind="
9297
value: method.carrier_code + '_' + method.method_code,
9398
checked: $parent.isSelected,
94-
attr: {'id': 's_method_' + method.carrier_code + '_' + method.method_code},
99+
attr: {
100+
'id': 's_method_' + method.carrier_code + '_' + method.method_code,
101+
'aria-labelledby': 'label_method_' + method.method_code + '_' + method.carrier_code + ' ' + 'label_carrier_' + method.method_code + '_' + method.carrier_code
102+
},
95103
click: $parent.selectShippingMethod"
96104
class="radio"/>
97105
<!--/ko-->
@@ -102,8 +110,12 @@
102110
<!-- ko template: getTemplate() --><!-- /ko -->
103111
<!-- /ko -->
104112
</td>
105-
<td class="col col-method" data-bind="i18n: method.method_title"></td>
106-
<td class="col col-carrier" data-bind="i18n: method.carrier_title"></td>
113+
114+
<td class="col col-method"
115+
data-bind="i18n: method.method_title, attr: {'id': 'label_method_' + method.method_code + '_' + method.carrier_code}"></td>
116+
117+
<td class="col col-carrier"
118+
data-bind="i18n: method.carrier_title, attr: {'id': 'label_carrier_' + method.method_code + '_' + method.carrier_code}"></td>
107119
</tr>
108120

109121
<!-- ko if: method.error_message -->

app/code/Magento/Customer/view/frontend/web/js/view/authentication-popup.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,9 @@ define(
3939

4040
/** Init popup login window */
4141
setModalElement: function (element) {
42-
authenticationPopup.createPopUp(element);
42+
if (authenticationPopup.modalWindow == null) {
43+
authenticationPopup.createPopUp(element);
44+
}
4345
},
4446

4547
/** Is login form enabled for current customer */

app/code/Magento/Multishipping/view/frontend/templates/checkout/link.phtml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,4 +7,4 @@
77
// @codingStandardsIgnoreFile
88

99
?>
10-
<a class="action multicheckout" href="<?php /* @escapeNotVerified */ echo $block->getCheckoutUrl()?>" title="<?php /* @escapeNotVerified */ echo __('Check Out with Multiple Addresses');?>"><span><?php /* @escapeNotVerified */ echo __('Check Out with Multiple Addresses');?></span></a>
10+
<a class="action multicheckout" href="<?php /* @escapeNotVerified */ echo $block->getCheckoutUrl()?>"><span><?php /* @escapeNotVerified */ echo __('Check Out with Multiple Addresses');?></span></a>

app/code/Magento/Sales/view/frontend/templates/order/recent.phtml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@
3030
<th scope="col" class="col shipping"><?php /* @escapeNotVerified */ echo __('Ship To') ?></th>
3131
<th scope="col" class="col total"><?php /* @escapeNotVerified */ echo __('Order Total') ?></th>
3232
<th scope="col" class="col status"><?php /* @escapeNotVerified */ echo __('Status') ?></th>
33-
<th scope="col" class="col actions">&nbsp;</th>
33+
<th scope="col" class="col actions"><?php /* @escapeNotVerified */ echo __('Action') ?></th>
3434
</tr>
3535
</thead>
3636
<tbody>

app/code/Magento/Ui/view/frontend/web/templates/group/group.html

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,10 +4,10 @@
44
* See COPYING.txt for license details.
55
*/
66
-->
7-
<div class="field" data-bind="css: additionalClasses">
8-
<label class="label">
7+
<fieldset class="field" data-bind="css: additionalClasses">
8+
<legend class="label">
99
<span data-bind="text: element.label"></span>
10-
</label>
10+
</legend>
1111
<div class="control">
1212
<!-- ko foreach: { data: elems, as: 'element' } -->
1313

@@ -33,4 +33,4 @@
3333
<!-- /ko -->
3434
<!-- /ko -->
3535
</div>
36-
</div>
36+
</fieldset>

app/design/adminhtml/Magento/backend/web/css/source/forms/_fields.less

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -300,6 +300,7 @@
300300
float: left;
301301
position: static;
302302
width: 100%;
303+
&:extend(.abs-fieldset-legend);
303304
& + br {
304305
display: block;
305306
height: 0;

app/design/adminhtml/Magento/backend/web/css/source/forms/fields/_field-tooltips.less

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,9 @@
3838
@_icon-font-line-height: 1,
3939
@_icon-font-color: @field-tooltip-icon__color
4040
);
41+
span {
42+
&:extend(.abs-visually-hidden);
43+
}
4144
}
4245
.admin__control-text:focus + .admin__field-tooltip-content,
4346
&:hover .admin__field-tooltip-content {

app/design/frontend/Magento/blank/Magento_Checkout/layout/checkout_cart_index.xml

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -14,9 +14,6 @@
1414
<arguments>
1515
<argument translate="true" name="text" xsi:type="string">Summary</argument>
1616
<argument name="tag" xsi:type="string">strong</argument>
17-
<argument name="attributes" xsi:type="array">
18-
<item name="title" translate="true" xsi:type="string">Summary</item>
19-
</argument>
2017
<argument name="css_class" xsi:type="string">summary title</argument>
2118
</arguments>
2219
</block>

app/design/frontend/Magento/blank/Magento_Checkout/layout/checkout_index_index.xml

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,6 @@
1111
<referenceContainer name="header.panel" remove="true"/>
1212
<referenceBlock name="top.search" remove="true"/>
1313
<referenceBlock name="catalog.compare.link" remove="true"/>
14-
<referenceBlock name="page.main.title" remove="true"/>
1514
<referenceBlock name="catalog.topnav" remove="true"/>
1615
<referenceContainer name="footer-container" remove="true"/>
1716
</body>

app/design/frontend/Magento/blank/Magento_Checkout/web/css/source/module/checkout/_checkout.less

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,13 @@
2323

2424
& when (@media-common = true) {
2525

26+
.checkout-index-index,
27+
.checkout-onepage-success {
28+
.page-title-wrapper {
29+
&:extend(.abs-visually-hidden all);
30+
}
31+
}
32+
2633
.checkout-container {
2734
&:extend(.abs-add-clearfix all);
2835
.lib-css(margin, 0 0 @checkout-wrapper__margin);

app/design/frontend/Magento/luma/Magento_Checkout/web/css/source/module/checkout/_checkout.less

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,13 @@
2727

2828
& when (@media-common = true) {
2929

30+
.checkout-index-index,
31+
.checkout-onepage-success {
32+
.page-title-wrapper {
33+
&:extend(.abs-visually-hidden all);
34+
}
35+
}
36+
3037
.checkout-container {
3138
&:extend(.abs-add-clearfix all);
3239
.lib-css(margin, 0 0 @checkout-wrapper__margin);

dev/tests/functional/tests/app/Magento/Catalog/Test/Block/Product/View/CustomOptions.php

Lines changed: 7 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -23,21 +23,21 @@ class CustomOptions extends Form
2323
*
2424
* @var string
2525
*/
26-
protected $optionsContext = '#product-options-wrapper > fieldset';
26+
protected $optionsContext = '#product-options-wrapper';
2727

2828
/**
2929
* Selector for single option block
3030
*
3131
* @var string
3232
*/
33-
protected $optionElement = './div[contains(@class,"field")][%d]';
33+
protected $optionElement = '#product-options-wrapper .field';
3434

3535
/**
3636
* Selector for title of option
3737
*
3838
* @var string
3939
*/
40-
protected $title = './/span[1]';
40+
protected $title = 'label';
4141

4242
/**
4343
* Selector for required option
@@ -156,16 +156,13 @@ public function getOptions(FixtureInterface $product)
156156
protected function getListOptions()
157157
{
158158
$customOptions = [];
159-
$context = $this->_rootElement->find($this->optionsContext);
160159

161-
$count = 1;
162-
$optionElement = $context->find(sprintf($this->optionElement, $count), Locator::SELECTOR_XPATH);
163-
while ($optionElement->isVisible()) {
164-
$title = $optionElement->find($this->title, Locator::SELECTOR_XPATH)->getText();
160+
$optionElements = $this->_rootElement->getElements($this->optionElement);
161+
foreach ($optionElements as $optionElement) {
162+
$title = $optionElement->find($this->title)->getText();
165163
$customOptions[$title] = $optionElement;
166-
++$count;
167-
$optionElement = $context->find(sprintf($this->optionElement, $count), Locator::SELECTOR_XPATH);
168164
}
165+
169166
return $customOptions;
170167
}
171168

0 commit comments

Comments
 (0)