User:BrianFreud/Uberscript

From MusicBrainz Wiki
< User:BrianFreud
Revision as of 22:02, 22 February 2008 by BrianSchweitzer (talk | contribs) ((Imported from MoinMoin))
Jump to navigationJump to search

Annoying browser bug of the day...

What's the difference between these?

...
        newReleaseTitle = makeViewer();
        newReleaseTitle.style.fontWeight = "700";
//        newReleaseTitle.style.border = '1px thin black';
        newReleaseTitle.id = 'Title_View_ReleaseTitle';
        newReleaseTitle.addEventListener("dblclick", switchTrackMode, true);
        newReleaseTitle.innerHTML = rRelease;
        trackTable[0].appendChild(newReleaseTitle);
...

function makeViewer() {
        var newTrackView = document.createElement('div');
        newTrackView.style.border = "0 none white";
        newTrackView.style.padding = "0";
        newTrackView.style.margin = "1px";
        newTrackView.style.overflow = 'none';
        newTrackView.style.height = "100%";
        newTrackView.style.wifth = "100%";
        newTrackView.style.display = "block";
        return newTrackView;
}

and

...
        newReleaseTitle = makeViewer();
        newReleaseTitle.style.fontWeight = "700";
        newReleaseTitle.style.border = '1px thin black';
        newReleaseTitle.id = 'Title_View_ReleaseTitle';
        newReleaseTitle.addEventListener("dblclick", switchTrackMode, true);
        newReleaseTitle.innerHTML = rRelease;
        trackTable[0].appendChild(newReleaseTitle);
...

function makeViewer() {
        var newTrackView = document.createElement('div');
        newTrackView.style.border = "0 none white";
        newTrackView.style.padding = "0";
        newTrackView.style.margin = "1px";
        newTrackView.style.overflow = 'none';
        newTrackView.style.height = "100%";
        newTrackView.style.wifth = "100%";
        newTrackView.style.display = "block";
        return newTrackView;
}

Seemingly, the only difference is that bit setting the border right? Not to Firefox... When that div is the only element inside a TD, and that TD is the only element inside a TR, and that TR is the only element inside a TABLE, if you set a border on that DIV, Firefox takes that nice clean:

<div style="border: 0pt none white; margin: 1px; padding: 0pt; height: 100%; display: block;" id="Title_View_ReleaseTitle">Little Earthquakes</div>

and turns it into this:

<div style=style="border: 1px none ; margin: 1px; padding: 0pt; height: 100%; display: block;" id="Title_View_ReleaseTitle"><div>Little Earthquakes</div></div>

And it ONLY does it under those very particular circumstances - every single other place that code was used, it worked fine. And that little extra DIV shouldn't matter... except that it also screws up a comparison like:

if(editTrack.value != viewTrack.innerHTML) 

by ALWAYS making it true, even if you changed nothing! ARGH! Only took 3 hours to figure that little bug out. :D

Brian

Just an unrelated note (unrelated to your problem): Using innerHTML as a setter is a very bad idea that will likely blow on you... -- dmppanda 01:21, 22 February 2008 (UTC)

Well, .value works for a textarea (and of course, innerHTML doesn't work there), but is there a better way to insert text into a div (other than createTextNode)? -- BrianSchweitzer 22:02, 22 February 2008 (UTC)