[jawsscripts] Re: The problematic highlight bar non-reading of an HTML-based "dropDown," that isn't identified as an editCombo box?

  • From: "Jim Snowbarger" <Snowman@xxxxxxxxxxxxxxxx>
  • To: <jawsscripts@xxxxxxxxxxxxx>
  • Date: Thu, 28 Nov 2013 21:42:04 -0600

Geoff,
Is that custom highlight color different if you explore it with the 
invisible cursor, and the jaws cursor safely tucked out of the way?

----- Original Message ----- 
From: "Geoff Chapman" <gch@xxxxxxxxxxxxxxxx>
To: <jawsscripts@xxxxxxxxxxxxx>
Sent: Thursday, November 28, 2013 6:00 PM
Subject: [jawsscripts] The problematic highlight bar non-reading of an 
HTML-based "dropDown," that isn't identified as an editCombo box?


Hi Scripters.
Ok, in relation to my query the other day, about a particular so-called 
"drop-down,"type element on a particular client's workPlace site that Jaws 
will not handle correctly,
I now have more information about this, and would very much appreciate 
anyone's views on where I might even start to solve this problem, as it's a 
dealBreaker for this poarticular employed person, re being able to do his 
job on the new system the company is rolling out in February.
It's a bit of a lengthy query, but I'd appreciate those who're able, to 
stick with me whilst I try and elaborate what, I, think is so far going on 
here.

Ok So, first, this is an html-based
system, and everything else here seems to be beautifully accessible, even 
the fields are all labelled properly.

Second, I've turned off AutoForms mode, as I find this mode very problematic 
and just annoying to navigate, after years of using the manual forms mode 
modality.
Also trying to eliminate as much of the so-called automatic smarts, as 
possible, to eliminate unknown and possibly erroneous behaviours etc.

However there's this one particular totally problematic 
control-type/element, which consists of initially what Jaws identifies as a 
straight ahead, edit, box.  However, this particular element, operates in 
practise, actually, more like what I understand to be often defined by jaws 
as an "EditCombo", control.
Whereby, as you start typing into the edit part of the field, a "drop-down" 
list appears,matching the entries it finds related to the letters in the 
text query entered so far.

(Additionally, the field visually contains a little downpointing graphical 
triangle, which sighted users may click on to drop down the unfiltered list, 
and visually view it that way, if preferred, with no text query filtering 
applied.)
But which is, not, activated at all by pressing Alt+DownArrow, as one would 
expect if Jaws handled the element as a proper EditCombo.

Now. The major problem is, that even though pressing downArrow, does start 
to navigate the entries in this field, placing what it identifies as a 
Grey13 on Lavender highlight highlight color over each selected entry,
Jaws does not read this highlight,, because it's locked into the fact that 
there's presumably still an iBeam edit cursor sitting in the edit box the 
whole time. So it just keeps reReading, "Edit," plus whatever the current 
text query value has been typed in, and is thus populating that edit field, 
upon each arrow press.

now another perhaps relevant aspect to understand about this particular 
controlType, as compared to some others I've seen, which although not 
identifying as EditCombos either, appear to behave in this very way, but 
which jaws does quite happily read,
Is thatt in our version, the control doesn't immediately populate the edit 
field, with the entire selection one navigates to with the arrow keys.
Whereas, the ones that jaws does happily appear to read properly, do seem to 
do this.
Therefore, in those fields where jaws does identify what one has arrowed to,
it's probably not doing so by reading/tracking the highllight bar, but 
simply by reading what's appearing at the edit cursor.

My first thought was to try and reClass the window, but, this didn't have 
any good effect, since of course as ai realized later, what I want to do 
here, is reClass, as far as Jaws is concerned, these individual elements, 
which are probably not the same as whole windows anyway.
When I looked at the class of the window in focus, it just showed some basic 
high-level seemingly irrelevant class  such as
Class = MozillaContentWindowClass etc.

So no joy there.



My second thought, was to try and identify the custom highlight color, and 
assign this as a custom highlight in jaws, hoping to attract it's attention 
to the fact that it should be checking for, and tracking/reading, anything 
in that highlight color.

However, I have no joy doing that either.

putting the jaws cursor on it, it reckons the highlight is Grey13 on 
Lavender, but, yep, this didn't work either.



So has anyone got any bright ideas as to what I might try next?
Is Custom Highlight tracking even working in jaws15 at present anywayz?
Some way I can tell jaws how to properly handle this type of element? 
ignoring the edit box cursor, and tracking the highlight bar instead?
Below I have included the rather comvoluted, but possibly helpful to someone 
who may know, element information from the jaws+Shift+f1, whilst over this 
particular field.

Thanks much for any tips!
See below for the tech stuff about the elemtn.



Element Information:

Tag INPUT has 7 parameters:

autocomplete=off

class= x-form-text x-form-field  x-form-focus

id=par-1C05555973514DF39BE96CF44694A3B2-d

size$

style
tabindex!002

type=text

MSAA Role*

Tag DIV has 3 parameters:

class=x-form-field-wrap x-form-field-trigger-wrap  x-trigger-wrap-focus

id=ext-gen437

style=

Tag DIV has 3 parameters:

class=x-form-element

id=x-form-el-par-1C05555973514DF39BE96CF44694A3B2-d

style=

Tag DIV has 3 parameters:

class=x-form-item

id=ext-gen434

tabindex=-1

Tag DIV has 3 parameters:

class= x-request-column x-request-column-out x-form-label-top x-column

id=ext-comp-1504

style=

Tag DIV has 3 parameters:

class=x-column-inner

id=ext-gen423

style=

Tag DIV has 3 parameters:

class=x-panel-body x-panel-body-noheader x-panel-body-noborder 
x-column-layout-ct

id=ext-gen386

style=

Tag DIV has 2 parameters:

class=x-panel-bwrap

id=ext-gen385

Tag DIV has 3 parameters:

class= x-panel request-view-category x-panel-noborder

id=ext-comp-1503

style=

Tag FORM has 5 parameters:

class=x-panel-body ss-svc-form-body x-panel-body-noheader 
x-panel-body-noborder x-form

enctype=application/x-www-form-urlencoded

id=ext-gen184

method=post

style=

Tag DIV has 2 parameters:

class=x-panel-bwrap

id=ext-gen335

Tag DIV has 3 parameters:

class= x-panel ss-svc-form x-panel-noborder x-form-label-left x-box-item

id=ext-comp-1270

style=

Tag DIV has 3 parameters:

class=x-box-inner

id=ext-gen334

style=

Tag DIV has 3 parameters:

class= x-box-layout-ct

id=ext-comp-1272

style=

Tag DIV has 3 parameters:

class=x-panel-body x-panel-body-noheader

id=ext-gen318

style=

Tag DIV has 2 parameters:

class=x-panel-bwrap

id=ext-gen316

Tag DIV has 3 parameters:

class= x-panel x-frs-sc-param-form ss-svc-form

id=ext-comp-1268

style=

Tag DIV has 3 parameters:

class=x-panel-body x-panel-body-noheader x-panel-body-noborder

id=ext-gen315

style=

Tag DIV has 2 parameters:

class=x-panel-bwrap

id=ext-gen314

Tag DIV has 2 parameters:

class= x-panel tab-panel parameters-tpl x-flex-portal-child x-panel-noborder

id=ext-comp-1283

Tag DIV has 3 parameters:

class= x-flex-portal-child-frame

id=ext-comp-1284

style=

Tag DIV has 3 parameters:

class=x-tab-panel-body x-tab-panel-body-top

id=ext-gen224

style=

Tag DIV has 2 parameters:

class=x-tab-panel-bwrap

id=ext-gen223

Tag DIV has 3 parameters:

class= x-tab-panel x-frs-flex-portlet

id=ext-comp-1239

style=

Tag DIV has 3 parameters:

class=x-panel-body x-panel-body-noheader x-panel-body-noborder

id=ext-gen208

style=

Tag DIV has 2 parameters:

class=x-panel-bwrap

id=ext-gen207

Tag DIV has 3 parameters:

class= x-panel x-frs-flex-portal x-panel-noborder x-border-panel

id=ext-comp-1223

style=

Tag DIV has 3 parameters:

class=x-panel-body x-panel-body-noheader x-panel-body-noborder 
x-border-layout-ct

id=ext-gen206

style=

Tag DIV has 2 parameters:

class=x-panel-bwrap

id=ext-gen205

Tag DIV has 3 parameters:

class= x-panel x-panel-noborder

id=ext-comp-1227

style=

Tag DIV has 3 parameters:

class=x-panel-body x-frs-flex-panel-body x-panel-body-noheader

id=ext-gen187

style=

Tag DIV has 2 parameters:

class=x-panel-bwrap

id=ext-gen185

Tag DIV has 3 parameters:

class= x-panel x-frs-formview

id=ext-comp-1222

style=

Tag DIV has 3 parameters:

class=x-panel-body x-panel-body-noheader x-panel-body-noborder

id=ext-gen17

style=

Tag DIV has 2 parameters:

class=x-panel-bwrap

id=ext-gen16

Tag DIV has 3 parameters:

class= x-panel x-frs-content x-border-panel

id=ext-comp-1002

style=

Tag DIV has 3 parameters:

class=x-panel-body x-panel-body-noborder x-border-layout-ct

id=ext-gen12

style=

Tag DIV has 2 parameters:

class=x-panel-mc

id=ext-gen15

Tag DIV has 1 parameters:

class=x-panel-mr

Tag DIV has 1 parameters:

class=x-panel-ml

Tag DIV has 2 parameters:

class=x-panel-bwrap

id=ext-gen11

Tag DIV has 3 parameters:

class= x-panel x-panel-noborder

id=WorkspaceFrame

style=

Tag BODY has 3 parameters:

href=https://kfchelp-stg.saasit.com/WorkspaceLoader.aspx?Id=ServiceReq&Profile=ObjectWorkspace&LayoutName=SDA-YAI&TabId=ext-comp-1101

id=main_body

rssúlse

MSAA Role

Tag IFRAME has 8 parameters:

class=x-managed-iframe

frameborder=0

id=ext-gen112

name=ext-gen112

scrolling=auto

src
style
title=Object Workspace

Tag DIV has 3 parameters:

class=x-panel-body x-panel-body-noheader x-panel-body-noborder

id=ext-gen111

style=

Tag DIV has 2 parameters:

class=x-panel-bwrap

id=ext-gen110

Tag DIV has 3 parameters:

class= x-panel x-panel-noborder

id=panelext-comp-1101

style=

Tag DIV has 3 parameters:

class= x-border-panel

id=app-frame-body

style=

Tag DIV has 3 parameters:

class= x-box-item x-border-layout-ct

id=app-content-wrapper

style=

Tag DIV has 3 parameters:

class=x-box-inner

id=ext-gen10

style=

Tag DIV has 3 parameters:

class= x-box-layout-ct

id=ext-comp-1003

style=

Tag DIV has 3 parameters:

class= x-app-content x-border-panel

id=AppBody

style=

Tag DIV has 3 parameters:

class= x-app-frame x-border-layout-ct

id=BorderWrapper

style=

Tag BODY has 3 parameters:

href=https://kfchelp-stg.saasit.com/Default.aspx

id=main_body

rssúlse

MSAA Role

Press ESC to close this message.


*****






Also, today in IE, (haven't tried yet in other browsers) I ran across a 
Suburb/postcode field, at the below URL, which I wanted you to just eyeball 
as it
*appeared* to work similarly to how I imagine our dropdowns on your site are 
working? which this one, jaws reads perfectly fine? but am unsure of course
of the backEnd element/Javascript running ... etc.



It's at the following URL:

https://www.oxfam.org.au/my/donate/typhoon-haiyan-yolanda?utm_campaign=Typhoon_2nd_ask&utm_medium=Email&utm_source=Typhoon_2nd_ask


Leaving virtual cursor enabled for the moment, After tabbing to the correct 
field, Hit enter to turn on forms mode, then type something that will bring
up multiple entries in the list, then hit down arrow. Try it in your version 
of IE?

For me here, in IE8, jaws reads each highlighted entry just fine as one 
arrows up and down in this list,

without having to assign any custom highlight colors at all.


For interest, though I know it won't mean much to you, here's the backend 
stuff re the element that Jaws reports when doing a Control+Insert+F1 on 
that
field in IE 8, without forms mode enabled.

(note that this Insert+Shift+F1 keystroke doesn't work when either forms 
mode is enabled or virtual cursor is off, which are effectively the same 
thing
anyway:)


Element Information:


Tag INPUT has 11 parameters:
aria-autocomplete=list
aria-haspopup=true
autocomplete=off
class=ui-autocomplete-input
id=suburb_ac
jquery172036613851847330175
name=suburb_ac
role=textbox
tabindex!
type=text
value=EPPING,  NSW,  2121
MSAA Role*


Tag DIV has 1 parameters:
class=input


Tag DIV has 1 parameters:
class=clearfix


Tag DIV has 1 parameters:
id=autoggle-au


Tag DIV has 1 parameters:
class=form-row


Tag FIELDSET has 0 parameters:


Tag FORM has 8 parameters:
_submit_attached=True
accept-charset=utf-8
action=https://www.oxfam.org.au/my/donate/typhoon-haiyan-yolanda
class=myform form-stacked
enctype=application/x-www-form-urlencoded
id=donation_form
jquery172036613851847330175(
method=post


Tag DIV has 1 parameters:
class=span11 main-content


Tag DIV has 1 parameters:
class=row


Tag DIV has 1 parameters:
id=bootstrap


Tag DIV has 1 parameters:
class=main-holder


Tag DIV has 1 parameters:
id=main


Tag DIV has 1 parameters:
id=wrapper


Tag BODY has 2 parameters:
href=https://www.oxfam.org.au/my/donate/typhoon-haiyan-yolanda?utm_campaign=Typhoon_2nd_ask&utm_medium=Email&utm_source=Typhoon_2nd_ask
rssúlse
MSAA Role




Press ESC to close this message.

__________�

View the list's information and change your settings at
http://www.freelists.org/list/jawsscripts



__________�

View the list's information and change your settings at 
http://www.freelists.org/list/jawsscripts

Other related posts: