cheton/browserify-css

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

Closed this issue · 1 comments

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);
}

Fixed in v0.4.2