cheton / browserify-css

A Browserify transform for bundling, rebasing, inlining, and minifying CSS files.
http://cheton.github.io/browserify-css/
MIT License
144 stars 22 forks source link

The same CSS text appear twice on Chrome, Firefox, and Safari #12

Closed cheton closed 9 years ago

cheton commented 9 years ago

The same CSS text appear twice on Chrome, Firefox, and Safari.

So in the first function for example, you can see that document.getElementById('myText').innerHTML = 'Thanks!'; is setting the innerHTML of the "myText" element to "Thanks!".

See the code snippet below: browser.js#L45

} else {
    style.innerHTML = cssText;
    style.appendChild(document.createTextNode(cssText));
    head.appendChild(style);
}

You can see that style.innerHTML = cssText; is setting the innerHTML to cssText, and it is followed by style.appendChild(document.createTextNode(cssText)), which appends the same CSS text to the newly created style.

Setting innerHTML is not necessary for Chrome, Firefox, and Safari. Removing style.innerHTML = cssText; will fix this bug. For example:

} else { // for Chrome, Firefox, and Safari
    style.appendChild(document.createTextNode(cssText));
    head.appendChild(style);
}
cheton commented 9 years ago

Fixed in v0.4.2