Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(466)

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: chrome/browser/resources/welcome/win10/inline.html

Issue 2742833002: [Win10 FRE] Fix ARIA attributes to conform to accordion widget. (Closed)
Patch Set: Created 3 years, 9 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
« no previous file with comments | « no previous file | chrome/browser/resources/welcome/win10/inline.js » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <html> 2 <html>
3 <head> 3 <head>
4 <meta charset="utf-8"> 4 <meta charset="utf-8">
5 <title>$i18n{headerText}</title> 5 <title>$i18n{headerText}</title>
6 6
7 <link rel="import" href="chrome://resources/cr_elements/icons.html"> 7 <link rel="import" href="chrome://resources/cr_elements/icons.html">
8 <link rel="import" href="chrome://resources/html/cr.html"> 8 <link rel="import" href="chrome://resources/html/cr.html">
9 <link rel="import" href="chrome://resources/html/action_link.html"> 9 <link rel="import" href="chrome://resources/html/action_link.html">
10 <link rel="import" href="chrome://resources/html/action_link_css.html"> 10 <link rel="import" href="chrome://resources/html/action_link_css.html">
(...skipping 257 matching lines...) Expand 10 before | Expand all | Expand 10 after
268 #taskbar-overlay { 268 #taskbar-overlay {
269 font-size: 12.2px; 269 font-size: 12.2px;
270 } 270 }
271 } 271 }
272 </style> 272 </style>
273 <div class="header-logo"></div> 273 <div class="header-logo"></div>
274 <div class="heading">$i18n{headerText}</div> 274 <div class="heading">$i18n{headerText}</div>
275 <div class="sections"> 275 <div class="sections">
276 <div class$="[[computeClasses(isCombined)]]"> 276 <div class$="[[computeClasses(isCombined)]]">
277 <template is="dom-if" if="[[isCombined]]"> 277 <template is="dom-if" if="[[isCombined]]">
278 <a is="action-link" class="section-heading" on-tap="onToggle"> 278 <div role="heading">
279 <div class="section-heading-text"> 279 <a id="tab1" is="action-link" class="section-heading" on-tap="onTo ggle" role="button" area-controls="panel1" aria-expanded="true">
280 $i18n{defaultBrowserSubheaderText} 280 <div class="section-heading-text" role="presentation">
281 </div> 281 $i18n{defaultBrowserSubheaderText}
282 <iron-icon class="section-heading-expand" icon="cr:expand-more"> 282 </div>
283 </iron-icon> 283 <iron-icon class="section-heading-expand" icon="cr:expand-more" role="presentation">
284 </a> 284 </iron-icon>
285 </a>
286 </div>
285 </template> 287 </template>
286 <template is="dom-if" if="[[!isCombined]]"> 288 <template is="dom-if" if="[[!isCombined]]">
287 <div class="section-heading"> 289 <div class="section-heading" tabindex="0" role="text">
dmazzoni 2017/03/09 19:55:08 What's the tabindex here for? It's unusual to mak
huangs 2017/03/10 17:23:15 It was for my own convenience -- previously I didn
288 <div class="section-heading-text"> 290 <div class="section-heading-text" role="presentation">
289 $i18n{defaultBrowserSubheaderText} 291 $i18n{defaultBrowserSubheaderText}
290 </div> 292 </div>
291 </div> 293 </div>
292 </template> 294 </template>
293 <ol class="section-steps"> 295 <ol id="panel1" class="section-steps" role="list" aria-labelledby="tab 1">
dmazzoni 2017/03/09 19:55:08 Role=list shouldn't be needed here, it's implicit
huangs 2017/03/10 17:23:15 This was a workaround, but seems to be not needed
294 <li> 296 <li tabindex="0">
dmazzoni 2017/03/09 19:55:08 No tabindex here. The link is already focusable
huangs 2017/03/10 17:23:15 Removed.
295 <a is="action-link" on-tap="onOpenSettings"> 297 <a is="action-link" on-tap="onOpenSettings" tabindex="0" role="lin k">
296 $i18n{openSettingsText} 298 $i18n{openSettingsText}
297 </a> 299 </a>
298 </li> 300 </li>
299 <li> 301 <li tabindex="0">
300 <div>$i18nRaw{clickEdgeText}</div> 302 <div role="presentation">$i18nRaw{clickEdgeText}</div>
dmazzoni 2017/03/09 19:55:08 All of the role=presentation in this change is saf
huangs 2017/03/10 17:23:15 These are added since otherwise MS Narrator, after
301 <div class="screenshot-image" id="default-image"> 303 <div class="screenshot-image" id="default-image" role="presentatio n">
302 <div class="screenshot-overlay" id="browser-overlay"> 304 <div class="screenshot-overlay" id="browser-overlay">
303 <div aria-hidden="true">$i18n{webBrowserLabel}</div> 305 <div aria-hidden="true">$i18n{webBrowserLabel}</div>
304 </div> 306 </div>
305 <div class="screenshot-overlay" id="edge-overlay"> 307 <div class="screenshot-overlay" id="edge-overlay">
306 <div aria-hidden="true">$i18n{microsoftEdgeLabel}</div> 308 <div aria-hidden="true">$i18n{microsoftEdgeLabel}</div>
307 </div> 309 </div>
308 </div> 310 </div>
309 </li> 311 </li>
310 <li>$i18nRaw{clickSelectChrome}</li> 312 <li tabindex="0">
313 <div role="presentation">$i18nRaw{clickSelectChrome}</div>
314 </li>
311 </ol> 315 </ol>
312 </div> 316 </div>
313 <template is="dom-if" if="[[isCombined]]"> 317 <template is="dom-if" if="[[isCombined]]">
314 <div class="section expandable"> 318 <div class="section expandable">
315 <a is="action-link" class="section-heading" on-tap="onToggle"> 319 <div role="heading">
dmazzoni 2017/03/09 19:55:07 aria-level=2 or something like that, just like a <
huangs 2017/03/10 17:23:15 That would require more complex CSS to restyle <h2
316 <div class="section-heading-text">$i18n{pinSubheaderText}</div> 320 <a id="tab2" is="action-link" class="section-heading" on-tap="onTo ggle" role="button" area-controls="panel2" aria-expanded="false">
dmazzoni 2017/03/09 19:55:08 aria-controls (spelling)
huangs 2017/03/10 17:23:15 Ah oops. Done.
317 <iron-icon class="section-heading-expand" icon="cr:expand-more"> 321 <div class="section-heading-text" role="presentation">
318 </iron-icon> 322 $i18n{pinSubheaderText}
319 </a> 323 </div>
320 <ol class="section-steps"> 324 <iron-icon class="section-heading-expand" icon="cr:expand-more" role="presentation">
321 <li>$i18nRaw{rightClickText}</li> 325 </iron-icon>
322 <li> 326 </a>
323 <div>$i18nRaw{pinInstructionText}</div> 327 </div>
324 <div class="screenshot-image" id="taskbar-image"> 328 <ol id="panel2" class="section-steps" role="list" aria-labelledby="t ab2">
329 <li tabindex="0">$i18nRaw{rightClickText}</li>
330 <li tabindex="0">
331 <div role="presentation">$i18nRaw{pinInstructionText}</div>
332 <div class="screenshot-image" id="taskbar-image" role="presentat ion">
325 <div class="screenshot-overlay" id="taskbar-overlay"> 333 <div class="screenshot-overlay" id="taskbar-overlay">
326 <div aria-hidden="true">$i18n{pinToTaskbarLabel}</div> 334 <div aria-hidden="true">$i18n{pinToTaskbarLabel}</div>
327 </div> 335 </div>
328 <div class="screenshot-overlay" id="icon-overlay"> 336 <div class="screenshot-overlay" id="icon-overlay">
329 </div> 337 </div>
330 </div> 338 </div>
331 </li> 339 </li>
332 </ol> 340 </ol>
333 </div> 341 </div>
334 </template> 342 </template>
335 </div> 343 </div>
336 <paper-button class="button" on-tap="onContinue"> 344 <paper-button class="button" on-tap="onContinue">
337 $i18n{continueText} 345 $i18n{continueText}
338 </paper-button> 346 </paper-button>
339 </template> 347 </template>
340 <script src="/welcome.js"></script> 348 <script src="/welcome.js"></script>
341 </dom-module> 349 </dom-module>
342 </head> 350 </head>
343 <body> 351 <body>
344 <welcome-win10-inline></welcome-win10-inline> 352 <welcome-win10-inline></welcome-win10-inline>
345 </body> 353 </body>
346 </html> 354 </html>
OLDNEW
« no previous file with comments | « no previous file | chrome/browser/resources/welcome/win10/inline.js » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698