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

Fix aria labels for toolbox trees on Voiceover.

Browse Source
This commit is contained in:
Sean Lip
2016-07-28 18:39:08 -07:00
parent 47888b806f
commit 3c395ac161
2 changed files with 9 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
accessible/field.component.js
View File

@@ -28,13 +28,13 @@ blocklyApp.FieldComponent = ng.core
.Component({
selector: 'blockly-field',
template: `
<input *ngIf="isTextInput()" [id]="mainFieldId"
<input *ngIf="isTextInput()" [id]="mainFieldId" type="text" [disabled]="disabled"
[ngModel]="field.getValue()" (ngModelChange)="field.setValue($event)"
[disabled]="disabled" type="text" aria-label="Press Enter to edit text">
[attr.aria-label]="disabled ? 'Disabled text field' : 'Press Enter to edit text'">
<input *ngIf="isNumberInput()" [id]="mainFieldId"
<input *ngIf="isNumberInput()" [id]="mainFieldId" type="number" [disabled]="disabled"
[ngModel]="field.getValue()" (ngModelChange)="field.setValue($event)"
[disabled]="disabled" type="number" aria-label="Press Enter to edit number">
[attr.aria-label]="disabled ? 'Disabled number field' : 'Press Enter to edit number'">
<div *ngIf="isDropdown()"
[attr.aria-labelledBy]="generateAriaLabelledByAttr('blockly-argument-menu', idMap['label'])">

8
accessible/toolbox-tree.component.js
View File

@@ -65,8 +65,9 @@ blocklyApp.ToolboxTreeComponent = ng.core
</ol>
</li>
<template ngFor #inputBlock [ngForOf]="block.inputList" #i="index">
<li role="treeitem" [id]="idMap['listItem' + i]" [attr.aria-level]="level + 1">
<blockly-field *ngFor="#field of inputBlock.fieldRow" [field]="field" [disabled]="true">
<li role="treeitem" [id]="idMap['listItem' + i]" [attr.aria-level]="level + 1" ng-if="inputBlock.fieldRow.length"
[attr.aria-labelledBy]="generateAriaLabelledByAttr(idMap['fieldLabel' + i])">
<blockly-field *ngFor="#field of inputBlock.fieldRow" [field]="field" [disabled]="true" [mainFieldId]="idMap['fieldLabel' + i]">
</blockly-field>
</li>
@@ -117,7 +118,8 @@ blocklyApp.ToolboxTreeComponent = ng.core
'blockCopyButton', 'sendToSelected', 'sendToSelectedButton']);
}
for (var i = 0; i < this.block.inputList.length; i++){
elementsNeedingIds.push('listItem' + i, 'inputList' + i);
elementsNeedingIds.push(
'listItem' + i, 'inputList' + i, 'fieldLabel' + i);
}
this.idMap = this.utilsService.generateIds(elementsNeedingIds);
if (this.isTopLevel) {