Browser different on other Macs

[lohill]

I have incorporated a modified version of 'Browser Sampler.rev' in my application and have gotten to the beta testing stage. My PC testers do not see this problem. I developed the application on my Mac and have not seen the problem and it is not present on my Wife's Mac. My two beta testers that use a Macintosh however report the sam problem. The problem that they see is that every editable field on the form has a black background rather than a white background. They cannot edit the fields or at least see that they are editing the fields.

I have to thinh that it is somehow related to either some Mac setting or some Safari setting but I have no clue as to which. Has anyone else experienced this? I sure would like to have a solution. I have attached a couple of screen shots. The first shows what I see on a typical screen. The second shows what they see. (That may be reversed - you'll know which.)

Thanks in advance,
Larry

What I see

Me.tiff (209.21 KiB) Viewed 8625 times

[Mark]

Hi Larry,

This is a known problem. Not sure if it is the web kit or LiveCode or the web object API, but other apps that use web objects, such as RealStudio, have the same problem. You need to set the background of the form fields explicitly using CSS.

Kind regards,

Mark

[lohill]

Mark,

What is CSS? and why on their Macs and not the two in our house?

Larry

[Mark]

Larry,

CSS is used to set the styles of web elements, such as fields, divs, tables etc.

This bug occurs only with particular combinations of Web Kit/Safari, Mac OS X and LiveCode (or any other software that uses webview objects).

Kind regards,

Mark

[lohill]

Thanks Mark,

I Googled CSS and see that there is something there for me to learn. Are the field background colors something I can control through my program as the web site is opened or does the designer of the website have to build the background colors into their code?

Larry

[shaosean]

It is a known issue with the WebKit.. I will look for the CSS you need to use to overcome it..

http://www.realsoftwareblog.com/2012/05 ... -text.html

[lohill]

Thanks shaosean,

I appreciate you help.

Regards,
Larry

[shaosean]

http://stackoverflow.com/questions/1058 ... oa-webview

[lohill]

Thanks shaosean,

Is it correct for me to conclude from your last reference that the changes need to be made at the web end and it is not something that I can control with LiveCode?

Larry

[shaosean]

yeah, the changes need to be made in the HTML.. you can always retrieve the page and inject the CSS yourself..

[lohill]

shaosean,

I put this code in a test button on my browser screen to see if I could change the background color of all my fields to brick red. Nothing seemed to happen. Can you spot my error or suggest something else?

Thanks,
Larry

Code: Select all

on mouseUp
   global gConIDRadi
   put gConIdRadi into tId
   put "for (I in document.getElementsByTagName(" & quote & "input" & quote & "))" & return & "{" & \
         return & "I.style.backgroungColor=" & quote & "#B22222" & quote & ";" & return & "}" into tScript
   get revBrowserExecuteScript(tID,tScript) 
   put the result into tResult
end mouseUp

[shaosean]

Code: Select all

I.style.backgroungColor

perhaps the spelling error in backgroundColor ?

[lohill]

I have an appointment to get my eyes examined in about an hour but that spelling correction didn't get the result I had hoped for.
See anything else?

Larry

[shaosean]

getElementsByTagName returns an array and you are not using I as an array in your code.. Place the following code in a field and use it from there, if everything works correctly then you can put it in a variable in script..

Code: Select all

var i;
var tInput = getElementsByTagName('input');
for (i = 0; i < tInput.length; i++) {
	tInput[i].style.backgroundColor = '#B22222';
}

ps.. in javascript, you can use single quotes which will save you from having to use & QUOTE in script and no need for RETURNs either as the semi-colons are what denote a line break in javascript..

[lohill]

Thanks shaosean,

This slight modification to you code worked just fine and I liked you idea about testing it from a field first.

Code: Select all

var i;
var tInput = document.getElementsByTagName('input');
for (i = 0; i < tInput.length; i++) {
   tInput[i].style.backgroundColor = '#B22222';
}

You have saved my neck.
Larry