274304 - Misplaced focus in Browser

Status: RESOLVED INCOMPLETE

(Tech Evangelism Graveyard :: Other, defect)

Description

[sturges]

User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8a6) Gecko/20041210
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8a6) Gecko/20041210

Browser pages from Websites where the focus is in the first field on the screen
when displayed through Internet Explorer [most versions] does not have the focus
in the first field when displayed by Mozilla.

Reproducible: Always
Steps to Reproduce:
1. Display a web page which has an input field
2. Cursor focus is not in this field
3.

Actual Results:  
Regardless of "in text" Find setting cursor focus is not in the first field of
the screen.

Expected Results:  
Cursor should be positioned in the first field in the same way as IE.

Try site https://www.nwolb.com to simulate

Comment 1

[Gérard Talbot]

That page is extremely badly coded.

DBIDa is the id attribute value (and also the name attribute value) identifying
the first field of the Customer Number which gets the focus as the page loads
the frames.

As one can see from
https://www.nwolb.com/secure/_private/scripts/browserDetect.js:

	var bname = navigator.appName;
	var bver = parseFloat(navigator.appVersion);	
	var isNN;
	
	if (bname == "Netscape"){
		isNN = true;
	} else {
		isNN = false;
	}
the browser detect is primitive and will be misleading in a majority of cases.

	<script type="text/javascript" language="javascript">
(...)
		window.onload = onLoadFunctions;
		document.onload = onLoadFunctions;
		function onLoadFunctions() {
			if(!isNN){if(top.stopClock){top.stopClock()}}
			onLoadFocus('DBIDa')
		}
	</script>
	
Now,	https://www.nwolb.com/secure/_private/scripts/onLoadFocus.js gives:
function onLoadFocus(item){

	if (isNN) {
	} else {
		frmItem = eval("form."+item)
		frmItem.focus()
		frmItem.select()
	}
}

I don't think form.InputName.focus() is sufficient here
( http://www.gtalbot.org/Bugzilla/Bug253091.html#Case6 ): form is the form's name;
		<form action="Logon.asp" id="logon" method="post" name="form" onSubmit="return
onceOnly()">
(...)
					Please enter your <a href="javascript:helpWindow('logon.asp')" title="New
window - Help with Customer Number">Customer Number</a>
(...)								<input autocomplete="off" type="text" class=txtWizard id="DBIDa"
size="6" maxlength="6" name="DBIDa" style=width:60 value='' onkeyup="return
(validateNumeric(document.forms.form.DBIDa) &&
autoTab(document.forms.form.DBIDa, 6, event));" onchange="return
validateNumeric(document.forms.form.DBIDa);">

This issue involved here may be that 
FormName.InputTextName.focus() is not supported. Node/Chain scope lookup. This
may be more about evangelism than anything else.

Sturges, are you a customer of that bank? Can you get in touch with them? They
are listed as Mozilla compatible at
http://blue-labs.org/rants/financial-shames.php
but I think this might be inaccurate or outdated.

Comment 2

[sturges]

Thank you for analysing this issue - I have contacted the site in question to
request an improvement.

However, the same issue occurs on many sites. It could be a same problem but is
there a way to simulate the IE behaoviour anyway and put the focus in the first
input field?

Comment 3

[Gérard Talbot]

> However, the same issue occurs on many sites. It could be a same problem but is
> there a way to simulate the IE behaoviour anyway and put the focus in the first
> input field?

Sturges, the improvement request you should address your site is:
1) to stop using dumb, deprecated, obsolete, unreliable, untrustworthy browser
detect based on user agent string. For starters, the user agent string is
entirely customizable in many non-MSIE browsers. For best results, they should
simply delete
https://www.nwolb.com/secure/_private/scripts/browserDetect.js
and use *_object method support detection_*
which will work accordingly and as expected in MSIE 5+, NS 6+, Mozilla 1.x,
Firefox 1.x, Safari 1.x, Konqueror 3.x, etcetc,.etc

More reading:
- A Strategy That Works: Object/Feature Detecting
http://jibbering.com/faq/faq_notes/not_browser_detect.html#bdFD
- Object detection: Browser detection - No, Object detection - Yes
http://www.quirksmode.org/js/support.html

2) to stop using, relying on
FormName.input.value 
but to use instead DOM 1 method
document.forms["FormName"].InputName.value
which will work accordingly and as expected in MSIE 5+, NS 6+, Mozilla 1.x,
Firefox 1.x, Safari 1.x, Konqueror 3.x, etcetc,.etc
More reading:
Using web standards in your web pages
http://www.mozilla.org/docs/web-developer/upgrade_2.html#dom_access
Mozilla Web author FAQ
http://www.mozilla.org/docs/web-developer/faq.html

> However, the same issue occurs on many sites. It could be a same problem (...)
There are several hundreds of coding practices or ways to interfere or reasons
why a focus() call could fail.

Sturges, let me know in this bugfile if your site gets in touch with you or
replies something more than an auto-response "thanks for your feedback, we will
..." email.

Comment 4

[Gérard Talbot]

Also in the more reading
How do I get the value of a form control?
http://jibbering.com/faq/#FAQ4_13

How do I detect Opera/Netscape/IE?
http://jibbering.com/faq/#FAQ4_26

Comment 5

[Gérard Talbot]

Sturges, if you can get in touch with your NatWest Online Bank site (preferably
their webmaster), then I'll convert this bug as a Tech Evangelism bugfile. As I
said, the pages I examined are extremely badly coded.

Comment 6

[Boris Zbarsky [:bzbarsky]]

To evang.  The branch this code puts us in simply doesn't try to focus the control.

I do recommend being a lot more polite than comment 3 in any correspondence with
the webmaster if you want to get results, though.  ;)

Comment 7

[Andrew Truong [:feer56] [:andrewtruong] [:atruong]]

Upon visiting the website, the card number text box is automatically opened and ready for me to fill in  my card number. OK to close?