I've just found solution in this thread:
https://groups.google.com/forum/#!topic/mozilla.dev.tech.dom/dQK0ioISIPM
It's really simple workaround. I'm having one range which should be highlighted and multiple ranges inside highlighted range which should be bolded.
At first, I have to deal with making bold text, because if I would highight text using "document.execCommand("BackColor",false, colour);" before that, it would somehow destroy my "bold ranges".
So solution is to replace or wrap text content of "bold ranges" with element like this:
if (boldRange) {
boldRange.deleteContents();
var newContents = document.createElement('b');
newContents.textContent = 'text that would be bolded';
boldRange.insertNode(newContents)
}
Example how it works is demonstrated here: