In this code, createRange
is not working in Chrome. In IE it is working. Please help how to rectify in this. Is there any other property to work like create range. So that it will helpful for my project.
<script language=javascript>
var isSelected;
function markSelection ( txtObj ) {
if ( txtObj.createTextRange ) {
txtObj.caretPos = document.selection.createRange().duplicate();
isSelected = true;
}
}
function insertTag ( txtName, enclose ) {
if(document.f_activity_email == null) {
var tag = document.getElementById('EmailTokenID').value;
}
else {
var formC = document.f_activity_email;
var tag = formC.EmailTokenID.value;
}
var closeTag = tag;
if ( enclose ) {
var attribSplit = tag.indexOf ( ' ' );
if ( tag.indexOf ( ' ' ) > -1 )
closeTag = tag.substring ( 0, attribSplit );
}
if ( isSelected ) {
var txtObj = eval ( "document.forms[0]." + txtName );
if (txtObj.createTextRange && txtObj.caretPos) {
var caretPos = txtObj.caretPos;
caretPos.text = ( ( enclose ) ? "<"+tag+">"+caretPos.text+"</"+closeTag+">" : tag+caretPos.text );
markSelection ( txtObj );
if ( txtObj.caretPos.text=='' ) {
isSelected=false;
txtObj.focus();
}
}
} else {
// placeholder for loss of focus handler
}
}
CreateTextRange is a Microsoft specific function, but there is an easy work around.
Use createRange
instead as in this post for example:
if (document.selection) { //IE
var range = document.body.createTextRange();
range.moveToElementText(document.getElementById(containerid));
range.select();
} else if (window.getSelection) { //others
var range = document.createRange();
range.selectNode(document.getElementById(containerid));
window.getSelection().addRange(range);
}
I had this issue with node's JSDOM and codemirror (which attempts to use document.createRange)
It happens because document.createRange (chrome) does not exist ATM on JSDOM and so it tries to use document.body.createTextRange (IE) instead and falls over.
To fix this I had to stub the document.createRange function in my unit test setup as follows:
global.document.createRange = () => {
return {
setEnd: () => {},
setStart: () => {},
getBoundingClientRect: () => {}
}
}
There is talk about JSDOM polyfilling document.createRange:
See https://github.com/tmpvar/jsdom/issues/399
At the time of writing this has not yet happened.
createTextRange is only in IE.
Have a look at this one http://help.dottoro.com/ljrvjsfe.php
As of March 31, 2020. This works for mocking JSDOM for jest unit tests
(window as any).global.document.createRange = () => {
return {
setEnd: () => {},
setStart: () => {},
getBoundingClientRect: () => {},
getClientRects: () => []
};
};
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With