Develop Reference

Cannot get the text of a span element using .getText() on a non-angular page

I'm trying to get the text value of an element <span> but it doesn't return anything with .getText()
`
//spec
var statPage = require('something');
describe('Start', function () {
describe('Setup', function () {
it('test quality', function(){
new statPage().quality();
});
});
});
//page object
Sender.prototype.quality = function () {
browser.ignoreSynchronization = true;
this.verifyPageUrl();
this.verifyTabName();
};
Sender.prototype.verifyTabName = function () {
console.log("inside verifyTabName()");
var EC = protractor.ExpectedConditions;
var tab = element(by.css("span.active-tab-head"));
browser.wait(EC.textToBePresentInElement(tab, 'u4uvpzn4'), 5000).then(function(){
console.log('inside browser wait');
});
tab.getText().then(function(tabFullName) {
console.log('tab name is : ' + tabFullName);
});
};
Sender.prototype.verifyPageUrl = function () {
browser.getCurrentUrl().then(function(text){
console.log('this is the right page : ' + text);
});
};
`

The code you've presented, looks correct and, I suspect, there could be a timing issue. Let's use textToBePresentInElement Expected condition and wait for u4uvpzn4 text to be present inside an active tab:
var EC = protractor.ExpectedConditions;
var tab = element(by.css("span.active-tab-head"));
browser.wait(EC.textToBePresentInElement(tab, 'u4uvpzn4'), 5000);
tab.getText().then(function(tabFullName) {
console.log('tab name is : ' + tabFullName);
});

You can make your code more dynamic by trying:
var tabName = element(by.css('.tab-head.active-tab-head'));
The only other issue I could think of off-hand is that you may not have any tabs set to .active-tab-head, which would return an empty string.

Something weird was happening coz protractor was not even recognizing browser.pause() But, reinstalling protractor fixed the issues!

disable function using javascript

I can not seem to find the code to disable a javascript function. What I want to do is have a javascript function and then I want to disable it. Here is the code:
<script>
var fooFunc = function fooFunction() {
alert("HELLO");
};
$(document).ready(function() {
fooFunc.disable();
});
</script>
<button onclick="fooFunc()">Button</button>
Basically, when the button is click the function should not work, it should be disabled. Thanks

"Disabling" fooFunc is the same as setting it to an empty function (not to null--that will cause an error when it is called the next time). In this case:
$(document).ready(function() {
fooFunc = function() { };
});
But I don't see how this is different from simply removing the onclick handler from the HTML element.
If you want the ability to disable/re-enable the function, you can write it like this:
fooFunc = function() {
function _fooFunc() {
if (!enabled) return;
alert("HELLO");
}
var enabled = true;
_fooFunc.enable = function() { enabled = true; };
_fooFunc.disable = function() { enabled = false; };
return _fooFunc;
}();
If you want to extend this to allow any function to be enabled/disabled, you can write a higher-order function, which takes any function as a parameter, and returns a function with enable and disable methods attached to it:
function disablable(fn) {
function inner() {
if (!enabled) return;
fn();
}
var enabled = true;
inner.enable = function() { enabled = true; };
inner.disable = function() { enabled = false; };
return inner;
}
Now you can define fooFunc as
var fooFunc = disablable(function fooFunction() {
alert("HELLO");
});
and the rest of your code will work as you want.

You can access the onclick property of the element..
<button id="id" onclick="fooFunc()">Button</button>
<script>
document.querySelector('#id').onclick = '';
</script>

If you don't want the function to work at all and be totally disabled then use the below.
If you want the function to work only under certain conditions then you will need if/else statements so it will work only when the conditions that you have set are met.
$(document).ready(function(){
$("button").onclick(function(event){
event.preventDefault();
});
});

You were going to define it back to undefined or null.
fooFunc=undefined;

You Should be doing this :) Change function definition on very first run and you are good to go.
<! DOCTYPE html>
<html lang="en">
<body>
<script>
var fooFunc = function() {
alert("HELLO");
fooFunc = function(){};
};
var enablefooFunc = function()
{
fooFunc = function() {
alert("HELLO");
fooFunc = function(){};
};
}
</script>
<button onclick="fooFunc()">Run once and Disable FooFunc</button>
<button onclick="enablefooFunc()">Enable FooFunc</button>
</body>
</html>

First jquery plugin

Im trying to make my first jquery plugin.. but actually i dont know what im doing wrong here.
$(document.ready(function()
{
var plugin = (function()
{
//this function is not accessible from the outside
function privateFunction()
{
}
//these functions are
return
{
alert1: function()
{
alert('Hallo');
},
alert2: function()
{
alert("hi");
}
}
})()
//but it is not working :/
plugin.alert1();
});
it is not executing one of the alerts. Am i putting some semicolons wrong?
i checked if all were closed

Javascript's automatic semicolon insertion will add a semicolon after return and undefined is returned.
Your code will look like
return;
{...
Replace
return
{
Should be
return {
You're also missing the ) after document in the first line of code.
Demo
$(document).ready(function() {
var plugin = (function() {
//this function is not accessible from the outside
function privateFunction() {
// Code Here
}
//these functions are
return {
alert1: function() {
alert('Hallo');
},
alert2: function() {
alert("hi");
}
};
}());
//but it is not working :/
plugin.alert1();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

TinyMCE error "z is undefined "

I want to add a custom button in the TinyMCE editor in the WordPress. I am trying following code, it works but it gives following error (please see the image below). I am unable to figure out what is causing the problem, I'll appreciate any help.
(function () {
tinymce.create("tinymce.plugins.myTest", {
createControl: function ( btn, e ) {
if ( btn == "custom_button" ) {
var a = this;
var btn = e.createSplitButton('custom_button', {
title: "Test",
});
return btn;
}
return null;
},
});
tinymce.PluginManager.add("myTest", tinymce.plugins.myTest);
})();

JQuery .hover / .on('mouseleave') not functioning properly

I am trying to use the hover function which is pretty rudimentary, but I can't seem to get the mouseout/mouseleave to function properly.
Code:
$(document).ready(function(){
$('.SList').css('display','none');
$(".MList a").on('mouseenter',
function(){
var HTMLArr = $(this).children().html().split(':');
$(this).children('p').replaceWith('<p>'+HTMLArr[0]+':&nbsp◤</p>');
$(this).siblings('.SList').slideDown('slow');
})
.on('mouseleave',function(){
var HTMLArr = $(this).children().html().split(':');
$(this).children('p').replaceWith('<p>'+HTMLArr[0]+':&nbsp◢</p>');
$(this).siblings('.SList').slideUp('slow');
});
});
The mouseenter works properly, but it is not even entering the code for the mouseleave. Any ideas would be greatly appreciated.
Fiddle

See this: DEMO
$(".MList a").on('mouseenter',
function(){
var HTML = $(this).children('p').html();
$(this).children('p').html(HTML.replace('◢','◤'));
$(this).siblings('.SList').slideDown('slow');
})
.on('mouseleave',function(){
var HTML = $(this).children('p').html();
$(this).children('p').html(HTML.replace('◤','◢'));
$(this).siblings('.SList').slideUp('slow');
});

You have an issue with the anchor of the event.
Change to use this:
$(".MList a").on('mouseenter', function () {
var myP = $(this).children('p');
var HTMLArr = myP.text().split(':');
myP.html( HTMLArr[0] + ':&nbsp◤');
$(this).next('.SList').slideDown('slow');
}).on('mouseleave', function () {
var myP = $(this).children('p');
var HTMLArr = myP.text().split(':');
myP.html( HTMLArr[0] + ':&nbsp◢');
$(this).next('.SList').slideUp('slow');
});
You have the same issue with click, and redo same thing. SO, rework and reuse: (you could even make it better but this shows the start of that)
$(".MList a").on('mouseenter', function () {
down($(this).find('p').eq(0));
}).on('mouseleave', function () {
up($(this).find('p').eq(0));
});
$(".MList a").click(function () {
if ($(this).siblings('.SList').is(':visible')) {
up($(this).find('p').eq(0));
} else {
down($(this).find('p').eq(0));
}
});
function up(me) {
var HTMLArr = me.text().split(':');
me.html(HTMLArr[0] + ':&nbsp◢');
me.parent().next('.SList').slideUp('slow');
}
function down(me) {
var HTMLArr = me.text().split(':');
me.html(HTMLArr[0] + ':&nbsp◤');
me.parent().next('.SList').slideDown('slow');
}