CodingPirates/blockly
1
0
Fork 0
mirror of https://github.com/google/blockly.git synced 2026-01-13 20:07:08 +01:00
Code Issues Packages Projects Releases Wiki Activity

Add aria-level and aria-selected attrs to dropdowns.

Browse Source
This commit is contained in:
Sean Lip
2016-09-19 19:33:35 -07:00
parent f4e316e8a9
commit 270ed961bf
2 changed files with 5 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
accessible/field.component.js
View File

@@ -44,7 +44,8 @@ blocklyApp.FieldComponent = ng.core
</label>
<ol role="group">
<li [id]="idMap[optionValue]" role="treeitem" *ngFor="#optionValue of getOptions()"
[attr.aria-labelledBy]="generateAriaLabelledByAttr(idMap[optionValue + 'Button'], 'blockly-button')">
[attr.aria-labelledBy]="generateAriaLabelledByAttr(idMap[optionValue + 'Button'], 'blockly-button')"
[attr.aria-level]="level" [attr.aria-selected]="field.getValue() == optionValue">
<button [id]="idMap[optionValue + 'Button']" (click)="handleDropdownChange(field, optionValue)"
[disabled]="disabled" tabindex="-1"
[attr.aria-label]="optionText[optionValue] + ' Press Enter to select this value'">
@@ -62,7 +63,7 @@ blocklyApp.FieldComponent = ng.core
{{field.getText()}}
</label>
`,
inputs: ['field', 'index', 'parentId', 'disabled', 'mainFieldId'],
inputs: ['field', 'index', 'parentId', 'disabled', 'mainFieldId', 'level'],
pipes: [blocklyApp.TranslatePipe]
})
.Class({

3
accessible/workspace-tree.component.js
View File

@@ -37,7 +37,8 @@ blocklyApp.WorkspaceTreeComponent = ng.core
<template ngFor #inputBlock [ngForOf]="block.inputList" #i="index">
<li role="treeitem" [id]="idMap['listItem' + i]" [attr.aria-level]="level + 1" *ngIf="inputBlock.fieldRow.length"
[attr.aria-labelledBy]="generateAriaLabelledByAttr(idMap['fieldLabel' + i])">
<blockly-field *ngFor="#field of inputBlock.fieldRow" [field]="field" [mainFieldId]="idMap['fieldLabel' + i]">
<blockly-field *ngFor="#field of inputBlock.fieldRow" [field]="field" [mainFieldId]="idMap['fieldLabel' + i]"
[level]="level + 2">
</blockly-field>
</li>