TypeError: window.tinyMCE.execInstanceCommand is not a function - tinymce-3

I can't add any shortcode in my wordpress editor. it shows - Uncaught TypeError: Object [object Object] has no method 'execInstanceCommand' . plesase help me to solve this.
the code(tinymce.js)
function init() {
tinyMCEPopup.resizeToInnerSize();
}
function getCheckedValue(radioObj) {
if(!radioObj)
return "";
var radioLength = radioObj.length;
if(radioLength == undefined)
if(radioObj.checked)
return radioObj.value;
else
return "";
for(var i = 0; i < radioLength; i++) {
if(radioObj[i].checked) {
return radioObj[i].value;
}
}
return "";
}
function tjshortcodesubmit() {
var tagtext;
var tj_shortcode = document.getElementById('tjshortcode_panel');
// who is active ?
if (tj_shortcode.className.indexOf('current') != -1) {
var tj_shortcodeid = document.getElementById('tjshortcode_tag').value;
switch(tj_shortcodeid)
{
case 0:
tinyMCEPopup.close();
break;
case "button":
tagtext = "["+ tj_shortcodeid + " url=\"#\" style=\"white\" size=\"small\"] Button text [/" + tj_shortcodeid + "]";
break;
case "alert":
tagtext = "["+ tj_shortcodeid + " style=\"white\"] Alert text [/" + tj_shortcodeid + "]";
break;
case "toggle":
tagtext = "["+ tj_shortcodeid + " title=\"Title goes here\"] Content here [/" + tj_shortcodeid + "]";
break;
case "tabs":
tagtext="["+tj_shortcodeid + " tab1=\"Tab 1 Title\" tab2=\"Tab 2 Title\" tab3=\"Tab 3 Title\"] [tab]Insert tab 1 content here[/tab] [tab]Insert tab 2 content here[/tab] [tab]Insert tab 3 content here[/tab] [/" + tj_shortcodeid + "]";
break;
default:
tagtext="["+tj_shortcodeid + "] Insert you content here [/" + tj_shortcodeid + "]";
}
}
if(window.tinyMCE) {
//TODO: For QTranslate we should use here 'qtrans_textarea_content' instead 'content'
window.tinyMCE.execInstanceCommand('content', 'mceInsertContent', false, tagtext);
//Peforms a clean up of the current editor HTML.
//tinyMCEPopup.editor.execCommand('mceCleanup');
//Repaints the editor. Sometimes the browser has graphic glitches.
tinyMCEPopup.editor.execCommand('mceRepaint');
tinyMCEPopup.close();
}
return;
}

I had the same problem. Change your code to this and it should work:
if(window.tinyMCE) {
/* get the TinyMCE version to account for API diffs */
var tmce_ver=window.tinyMCE.majorVersion;
if (tmce_ver>="4") {
window.tinyMCE.execCommand('mceInsertContent', false, tagtext);
} else {
window.tinyMCE.execInstanceCommand('content', 'mceInsertContent', false, tagtext);
}
tinyMCEPopup.editor.execCommand('mceRepaint');
tinyMCEPopup.close();
}
return;
}
Note: since .js files are cached, you'll need to do a hard refresh to get this to work. If you are still seeing the same console errors, that would likely be the cause.

Scott B's answer is partially innacurate.
The point of execInstanceCommand in TinyMCE version 3 was to execute a command on a specific instance of TinyMCE in the document. Calling execCommand without specifying an instance will either use the focused instance or the first instance in the document, if none is currently focused.
To specify the instance you would like to execute your command on in TinyMCE version 4, call execCommand on the desired editor instance like so:
tinyMCE.get(editorId).execCommand(...);

Related

JavaFx TreeTableView with Checkboxes, where to put listener?

I am building up a playlist manager.
Which works well but has deep flaws in the design, and thus, is difficult to UPGRADE / MAINTAIN.
In that context I now have a javafx TreeTableView having a column as Checkbox.
To get a visual idea, here is what it looks like :
In order to manage the check/uncheck children and parents of checkboxes, I implemented a listener, applied in mass AFTER the tree is built :
private void addMarkListenerToAllChildren(TreeItem<PlaylistTtRow> parentTreeItem) {
parentTreeItem.getChildren().forEach(playlist -> {
playlist.getValue().isMarked.addListener((ChangeListener<Boolean>) (obs, isPrevStatus, isNowStatus) -> {
if (!isStopListen) {
chbxOnChangeMarkTreeItem(playlist, isNowStatus);
logDLI.append(LogCategory.DEVELOPMENT, LogSeverity.INFO, LogGroup.A, "Value of " + playlist.getValue().playlistIconAndName.getValue().getPlaylistName() + " changed to " + playlist.getValue().isMarked.getValue());
}
});
logDLI.append(LogCategory.DEVELOPMENT, LogSeverity.INFO, LogGroup.A, "Listener added to " + playlist.getValue().playlistIconAndName.getValue().getPlaylistName());
if (!playlist.getChildren().isEmpty()) {
addMarkListenerToAllChildren(playlist);
}
});
}
This is in my controller at the moment !!! It's obviously in the wrong place as design... where should it go ?
And here is the process of a 'change' in checkbox value... Which is at moment in my Controller as well... again wrongly placed :
// TODO : The complete processing linked to Makred row, should be placed in the corresponding Object ! Or better, in a parent Object to be extended to TtvPlaylist / TtvTrack / ...
void chbxOnChangeMarkTreeItem(TreeItem<PlaylistTtRow> tiPlaylist, boolean isSetTo) {
if (!isUserClicked) {
isUserClicked = true;
tiPlaylistUserClicked = tiPlaylist;
}
logDLI.append(LogCategory.DEVELOPMENT, LogSeverity.INFO, LogGroup.A, "Value of '" + tiPlaylist.getValue().playlistIconAndName.getValue().getPlaylistName() + "' changed to : " + tiPlaylist.getValue().getIsMarked());
if (tbtnAutoMarkChildren.isSelected()) {
tiPlaylist.getChildren().forEach(child -> {
if (!isStopListen) {
child.getValue().setIsMarked(isSetTo);
} else {
logDLI.append(LogCategory.DEVELOPMENT, LogSeverity.INFO, LogGroup.A, "Value of '" + tiPlaylist.getValue().playlistIconAndName.getValue().getPlaylistName() + "' not changed because it has 'StopListen' set to true.");
}
});
}
// If playlist has leafs, and 'OnlyLeafs' are to be checked, force playlist as unchecked.
if (!tiPlaylist.getChildren().isEmpty() && configs.isMarkOnlyLeafs) {
isStopListen = true;
tiPlaylist.getValue().isMarked.set(false);
isStopListen = false;
}
// If There are parents, and 'OnlyLeafs' is NOT set, set parents to be checked (without auto-selecting children, of course).
TreeItem<PlaylistTtRow> tiTested = tiPlaylist;
while ((tiTested.getParent() != null) && (isSetTo)) {
isStopListen = true;
tiTested.getParent().getValue().isMarked.set(true);
isStopListen = false;
tiTested = tiTested.getParent();
}
// TODO : If the last of children is 'unmarked', unmark the parent.
if (tiPlaylist.equals(tiPlaylistUserClicked)) {
getInfosOnCheckedPlaylistsFromNode(tiPlaylist);
isUserClicked = false;
}
}
My aim is :
Have heritage of my PLAYLIST tree, for my TRACKS tree, which will also need marked row etc...
Add some more listeners to other columns
Be able to implement SPECIFIC methods on certain events
Any help would be appreciated. Thanks in advance...

How to get Text from Shadow Dom element in WebDriver

i want to fetch the text from shadow element of Dom
http://prntscr.com/e9smzg
I have tried below code but its not working..
public String ShadowRootElement(String str) {
WebElement ele = (WebElement) ((JavascriptExecutor) driver).executeScript("return arguments[0].shadowRoot",getElementByXpath(str));
return ele.findElement(By.xpath("//div[#id='inner-editor']")).getText().toString();
}
Please refer attached screenshot link for html code.
public String getEmailId(String str){
return ShadowRootElement(Repo.get("ipEmailId"));
}
First of all, the way you call ele.findElement(By.xpath("//div[#id='inner-editor']")).getText().toString(); is troublesome.
To locate elements under shadow root node,By.xpath() won't work. Only By.id() & By.cssSelector() will work as valid locators. Please refer to this post for more details.
Secondly (and unfortunately), I found even if you can locate the node under shadow root, element.getText() method would return an empty string.. Simply put it doesn't work for me either :-(
you will not be able to use xpath with shadowroots, since xpath is applied to DOM
Here, you can pull back all the elements, then use css or other to check if text exists, eg (use driver instead of session, since I wrap my driver):
public static String getAllShadowRootsText(DriverSessions session, String rootNode)
{
String elsText = "";
try {
List<SearchContext> sroots = getAllShadowRoots(session, rootNode);
for(SearchContext sroot : sroots){
// we have to specify the elements with shadowroot children, we cant just get all *
List<WebElement> els = sroot.findElements(By.cssSelector(validDomTypes));
for(WebElement el : els) {
elsText = elsText + el.getText();
}
}
}
catch (Exception e) {} // we might want to loop this, pages change and shadow roots move / go stale
return elsText;
}
public static List<SearchContext> getAllShadowRoots(DriverSessions session, String rootNode)
{
String script = ""
+ "function getShadowRoots (node, sroots, func) { "
+ "var done = func(node); "
+ "if (done) {return true;} "
+ "if ('shadowRoot' in node && node.shadowRoot) { "
+ "sroots.push(node.shadowRoot); "
+ "var done = getShadowRoots(node.shadowRoot, sroots, func); "
+ "if (done) {return true;} "
+ "} "
+ "node = node.firstChild; "
+ "while (node) { "
+ "var done = getShadowRoots(node, sroots, func); "
+ "if (done) {return true;} "
+ "node = node.nextSibling; "
+ "} "
+ "} "
+ "try { "
+ "sroots = new Array(); "
+ "getShadowRoots("+rootNode+", sroots, function (node, sroots) {}); "
+ "return sroots;"
+ "} "
+ "catch(err){return null};";
JavascriptExecutor js = (JavascriptExecutor)session.getDriver();
#SuppressWarnings("unchecked")
List<SearchContext> els = (List<SearchContext>) js.executeScript(script);
return els;
}

My first ExtendScript... and it doesn't work

I am developing a script for Adobe Bridge CS6. For the moment, all I want to do is to access the size (width and height) of a thumbnail that the user has selected and show it, either on a popup or on the console. Here is my script:
function TestBridge() {
this.requiredContext = "\tAdobe Bridge must be running.\n\tExecute against Bridge as the Target.\n";
}
TestBridge.prototype.run = function() {
if(!this.canRun())
{
return false;
}
var selectedThumbnails = app.document.getSelection();
if (selectedThumbnails.length > 0) {
$.writeln("MEEEEEPT");
var thumb = selectedThumbnails[0];
var x = thumb.core.preview.preview.width;
var y = thumb.core.preview.preview.height;
//alert('MEEEEEPT: x = ' + x + ', y = ' + y);
$.writeln("MEEEEEPT: x = " + x + ", y = " + y);
return true;
}
$.writeln("MOOO");
return false;
}
TestBridge.prototype.canRun = function()
{
// Must be running in Bridge & have a selection
if( (BridgeTalk.appName == "bridge") && (app.document.selectionLength == 1)) {
return true;
}
// Fail if these preconditions are not met.
// Bridge must be running,
// There must be a selection.
$.writeln("ERROR:: Cannot run.");
$.writeln(this.requiredContext);
return false;
}
The only problem is that... well, it doesnt work. I open it on ExtendScript Toolkit, set the target to Bridge CS6, hit "Run"... and all that happens is that the console says "Result: canRun()".
Looking at other code samples from Adobe, I see that the structure of their scripts is pretty much the same as mine, so I don't really know what I'm doing wrong.
Edit: what I needed was to add in the end a line to call the function, like so:
new.TestBridge.run();
Silly, silly mistake.

Why does R# tell me, "Not all code paths return a value" in a click handler?

At the end of my submit button click handler, Resharper warns that, "Not all code paths return a value."
What value would it be expecting from an event handler?
In deference to full disclosure, this is that event handler:
$("#submit_button").click(function() {
// http://stackoverflow.com/questions/18192288/how-can-i-compare-date-time-values-using-the-jqueryui-datepicker-and-html5-time
var begD = $.datepicker.parseDate('mm/dd/yy', $('#BeginDate').val());
var endD = $.datepicker.parseDate('mm/dd/yy', $('#EndDate').val());
if (begD > endD) {
alert('Begin date must be before End date');
$('#BeginDate').focus();
return false;
}
else if (begD.toString() == endD.toString()) {
var dteString = begD.getFullYear() + "/" + (begD.getMonth() + 1) + "/" + begD.getDate();
var begT = new Date(dteString + " " + $('#BeginTime').val());
var endT = new Date(dteString + " " + $('#EndTime').val());
if (begT > endT) {
alert('Begin date must be before End date');
$('#BeginTime').focus();
return false;
}
}
$("#NumberOfResults").css("visibility", "visible");
$("#NumberOfResults").html("Please wait...");
EnableButton("submit_button", false);
// If all are selected, don't enumerate them; just set it at "All" (change of case shows that the logic did execute)
var deptsList = $('#depts').checkedBoxes();
if (deptsList.length < deptsArray.length) {
$('#deptHeader span').html(deptsList.join(", "));
}
else if (deptsList.length == deptsArray.length) {
$('#deptHeader span').html("All");
}
// " "
var sitesList = $('#sites').checkedBoxes();
$('#sitesHeader span').html(sitesList.join(", "));
if (sitesList.length < sitesArray.length) {
$('#sitesHeader span').html(sitesList.join(", "));
}
else if (sitesList.length == sitesArray.length) {
$('#sitesHeader span').html("All");
}
$('#hiddenDepts').val(deptsList);
$('#hiddenSites').val(sitesList);
var UPCs = $('#UPC').val();
if (UPCs == "All") {
$('#UPC').val("1"); // take everything (1 and greater)
}
var resultsText = jQuery.trim($("#spanNumberOfResults").text());
if (resultsText != "") {
$("#NumberOfResults").css("visibility", "visible");
if (resultsText == "0") {
$("#NumberOfResults").css("color", "red");
} else {
var href = '/#ConfigurationManager.AppSettings["ThisApp"]/CCRCriteria/LoadReport';
// report_parms (sic) is referenced from LoadReport
var report_parms = {
GUID: "#Model.GUID",
SerialNumber: "#Model.SerialNumber",
ReportName: "#Model.ReportName"
};
window.open(href, "report_window", "resizable=1, width=850, left=" + (screen.width / 2 - 425));
}
}
}); // end of submit button click
Resharper isn't aware of event handlers.
It sees that your function will sometimes return false and sometimes won't return anything, and it complains.
It doesn't realize that this pattern is perfectly fine for event handlers.
Ignore it. Click handlers "can" return a boolean value indicating whether to process the click normally (true) or ignore it (false).
Resharper sees any return in the function as a clue that it should always return something.

Show static non-clickable heading in AutoCompleteExtender list

I have an AutoCompleteExtender from the Ajax Control Toolkit. I need to have a heading in the dropdown list that shows how many items found, but it should not be selectable as an item.
I have tried this using jQuery, but even when I just add as a div, it is still selected as an item into the text box when I click on it:
function clientPopulated(sender, e) {
var completionList = $find("AutoCompleteEx").get_completionList();
var completionListNodes = completionList.childNodes;
for (i = 0; i < completionListNodes.length; i++) {
completionListNodes[i].title = completionListNodes[i]._value.split(':')[2];
}
var resultsHeader;
if(completionListNodes.length==1000)
resultsHeader = 'Max count of 1000 reached.<br/>Please refine your search.';
else if(completionListNodes.length>0)
resultsHeader = completionListNodes.length + ' hits.';
else
resultsHeader = msg_NoObjectsFound ;
jQuery(completionListNodes[0]).before('<div>' + resultsHeader + '</div>');
}
Add OnClientItemSelected and OnClientShowing events handlers and try script below:
function itemSelected(sender, args) {
if (args.get_value() == null) {
sender._element.value = "";
}
}
function clientShowing() {
var extender = $find("AutoCompleteEx");
var optionsCount = extender.get_completionSetCount();
var message = "";
if (optionsCount == 1000) {
message = 'Max count of 1000 reached.<br/>Please refine your search.';
}
else if (optionsCount > 0) {
message = optionsCount + " hits."
}
else {
message = "oops."
}
jQuery(extender.get_completionList()).prepend("<li style='background-color:#ccc !important;'>" + message + "</li>");
}
Added:
you even can do this without OnClientItemSelected handler:
function clientShowing() {
var extender = $find("AutoCompleteEx");
var oldSetText = extender._setText;
extender._setText = function (item) {
if (item.rel == "header") {
extender._element.value = "";
return;
}
oldSetText.call(extender, item);
};
var optionsCount = extender.get_completionSetCount();
var message = "";
if (optionsCount == 1000) {
message = 'Max count of 1000 reached.<br/>Please refine your search.';
}
else if (optionsCount > 0) {
message = optionsCount + " hits."
}
else {
message = "oops."
}
jQuery(extender.get_completionList()).prepend("<li rel='header' style='background-color:#ccc !important;'>" + message + "</li>");
}
We can give a better answer if you post the output html of your autocomplete control. Anyway if its a dropdown control;
jQuery(completionListNodes[0]).before('
<option value="-99" disabled="disabled">your message here</option>'
);
The answer by Yuriy helped me in solving it so I give him credit although his sollution needed some changes to work.
First of all, the clientShowing event (mapped by setting OnClientShowing = "clientShowing" in the AutoExtender control) is executed on initialization. Here we override the _setText method to make sure nothing happens when clicking on the header element. I have used the overriding idea from Yuriy's answer that really did the trick for me. I only changed to check on css class instead of a ref attribute value.
function clientShowing(sender, e) {
var extender = sender;
var oldSetText = extender._setText;
extender._setText = function (item) {
if (jQuery(item).hasClass('listHeader')) {
// Do nothing. The original version sets the item text to the search
// textbox here, but I just want to keep the current search text.
return;
}
// Call the original version of the _setText method
oldSetText.call(extender, item);
};
}
So then we need to add the header element to the top of the list. This has to be done in the clientPopulated event (mapped by setting OnClientPopulated = "clientPopulated" in the AutoExtender control). This event is executed each time the search results have been finished populated, so here we have the correct search count available.
function clientPopulated(sender, e) {
var extender = sender;
var completionList = extender.get_completionList();
var completionListCount = completionList.childNodes.length;
var maxCount = extender.get_completionSetCount();
var resultsHeader;
if(completionListCount == maxCount)
resultsHeader = 'Max count of ' + maxCount + ' reached.<br/>'
+ 'Please refine your search.';
else if(completionListCount > 0)
resultsHeader = completionListCount + ' hits.';
else
resultsHeader = 'No objects found';
jQuery(completionList).prepend(
'<li class="listHeader">' + resultsHeader + '</li>');
}
I have also created a new css class to display this properly. I have used !important to make sure this overrides the mousover style added from the AutoExtender control.
.listHeader
{
background-color : #fafffa !important;
color : #061069 !important;
cursor : default !important;
}

Resources