Strange problem with Google Maps and Ajax in Google Chrome and Safari

Question

I am developing web-application using Google Maps API and ASP.NET Ajax. Here is my JavaScript-code for PageLoad:

map.openInfoWindowHtml(map.getCenter(),'Hello, <b>world</b>!');

First run is successful. But after execution some ASP.NET Ajax-function we have strange effect: In Internet Explorer, Mozilla Firefox and Opera everything is good, but in Google Chrome and Safari text with html-tags is invisible. In other words in Google Chrome we have text: “Hello, !”

I want to make the application that would normally in Google Chrome and Safari too. How can I do it?

Update:

String "Hello, <b>world</b>, <strong>world</strong>, <span style='font-weight: bold;'>World</span>, <a href='http://ya.ru'&gt;Link&lt;/a&gt;." transform to "Hello, , , , . " (I examined the DOM). Words really are disappearing.

I observed this strange effect on any Ajax-function with request to server.

Update2:

Many thanks to Koobz for many leading questions. They helped me a more detailed understanding of the problem.

First of all, full description of actions:

1. Load the page. GMap have several markers with dblclick-event in JavaScript. Dblclick event exec marker.openInfoWindowHtml(/My text/). /My text/ is located in JavaScript of my Page.
2. I double-click on the marker. I see a infoWindow with a normal formatting
3. Exec __doPostBack (starndard ASP.NET PostBack)
4. In server side JavaScript is updated with same
5. Server return some information with /My text/ to my page
6. I doouble-click on the marker. I see a infoWindow with a wrong formatting.

An interesting fact, which puts me in embarrassing:

I try set to “Hello, <b>world</b>, &lt;b&gt;test&lt;/b&gt;”

Before Ajax function in all browser I have: “Hello, world, <b>test</b>”

After Ajax function in Google Chrome and Safari: "Hello, ,test"

After Ajax function in Mozilla, Opera and IE: “Hello, world, <b>test</b>”

What Chrome and Safari have features that may cause such behavior? Now I can write separately necessary infoWindow-text for each browser. But I would like to find a normal way to solve my problem.

Answer 1

Do you see the problem with any html tags in the info window? As an experiment, try:

<span style="font-weight: bold;">World</span>.  

I am wondering if there is a unclosed bold tag somewhere in the DOM?

I am messing around with this problem, but I haven't been able to reproduce it. Having a look at what the Ajax function does would be helpful.

Answer 2

Try this:

map.openInfoWindowHtml(map.getCenter(),'Hello, <strong>world</strong>!');

the strong tag is more standards compliant, worth a shot

As others have said, you need to post your code.

Answer 3

Hit ctrl+shift+j to open up your chrome developer tools.

1. Set a breakpoint right before the function call that breaks everything.
2. Attempt to reproduce the bug.
3. After the break point hits, step through your code until the text disappears.
4. Set a breakpoint after the text first disappeared.
5. Repeat this process. Refine your breakpoints until you've narrowed down where the bug is occurring.

It could be any number of things. I have no idea what kind of Ajax things you're doing. Are you dynamically updating content on your page after doing the request? It's possible that this update code is modifying dom elements that it shouldn't be. Tracing through using the methodology above will help nail it if this is the case.

If you're using jQuery, maybe one of your selectors is out of whack and it's eating up content. Chrome is very good and I'm hesitant to believe it's a javascript bug or anything like that.

Validate your HTML. If you're traversing the dom, invalid markup might result in chrome "seeing" a different picture than other browsers. Just look for broken tags and ignore all the other things a validator complains about.

---

Wild guess: but the way it's stripping out HTML might point to some kind of XSS protection. Is the Ajax script that's returning the new HTML code on another domain than the one the visitor is viewing?

Some info here: http://groups.google.com/group/chromium-dev/browse_thread/thread/d2931d7b670a1722/d56bdfccfcef677f