Develop Reference

Intl Tel Input Uncaught TypeError: Cannot read property 'getAttribute' of null at new Iti (intlTelInput.js:146) at intlTelInput.js:1282

<link rel="stylesheet" href="styles/intlTelInput.scss">
<input type="tel" required id="#consultPhone">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/15.0.0/js/intlTelInput.js"></script>
<script src="scripts/scripts.js"></script>
<script type="text/javascript">
var consultInput = document.querySelector('#consultPhone');
var iti = window.intlTelInput(consultInput, {
separateDialCode:true,
utilsScript: "https://cdn.jsdelivr.net/npm/intl-tel-input#17.0.3/build/js/utils.js",
});
window.iti = iti;
</script>
So this is my code, when I open the page the input is empty and i get this error:
Uncaught TypeError: Cannot read property 'getAttribute' of null at new Iti (intlTelInput.js:146 at intlTelInput.js:1282 at index.html:973

Basically I am stupid, forgot to remove the hashtag from the id 😅

How to implement VAST-ad using MediaElementJS and Youtube?

I try to implement VAST-ad, but it doesn't work. My code doesn't show VAST ad before playing video
Here is my code:
var player = new MediaElementPlayer('#id', {
playsInline: true,
vastAdTagUrl: 'url',
vastEnableSkip: true,
vastSkipSeconds: 3,
features: ['vast'],
vastAdsType: 'vast',
success: function(media, node, playerElement) {
}
});
Here is links:
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script src="mediaelement-and-player.js"></script>
<link rel="stylesheet" href="mediaelementplayer.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/mediaelement-plugins/2.5.0/ads/ads.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/mediaelement-plugins/2.5.0/ads/ads.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/mediaelement-plugins/2.5.0/ads-vast-vpaid/ads-vast-vpaid.js"></script>
I have this error in Console:
Uncaught TypeError: Cannot set property 'mejs.ad-skip' of undefined
at Object.1 (ads.js:14)

Late Answer:
What is the exact url in your code vastAdTagUrl: 'url'?
It needs to be xml. For the sample of xml, you can go to: https://github.com/InteractiveAdvertisingBureau/VAST_Samples/blob/master/VAST%203.0%20Samples/Video_Clicks_and_click_tracking-Inline-test.xml
Also, for the features, need to have ads too:
features: ['vast','ads'],

Using CDN, how to set the correct custom plugin path?

I'm new in CKEditor, and for the first time I'm trying to make a plugin. I'm trying to create a simple button as shown here.
I'm encountering the following error:
Uncaught Error: [CKEDITOR.resourceManager.load] Resource name "timestamp" was not found at "/WEB-INF/recursos/javascript/plugins/timestamp/plugin.js?t=H0CF".
at window.CKEDITOR.window.CKEDITOR.dom.CKEDITOR.resourceManager.<anonymous> (ckeditor.js:234)
at h (ckeditor.js:230)
at Array.n (ckeditor.js:230)
at q (ckeditor.js:230)
at HTMLScriptElement.CKEDITOR.env.ie.f.$.onerror (ckeditor.js:231)
Here's my "plugin.js" code:
CKEDITOR.plugins.add('timestamp',
{
icons : 'timestamp',
init : function(editor)
{
editor.addCommand('insertTimestamp',
{
exec : function(editor)
{
var now = new Date();
editor.insertHtml('The current date and time is: <em>' + now.toString() + '</em>');
}
});
editor.ui.addButton('Timestamp',
{
label : 'Insert Timestamp',
command : 'insertTimestamp',
toolbar : 'insert'
});
}
});
And my default JavaScript code ("codigo.js"):
$(document).ready(function()
{
CKEDITOR.plugins.addExternal( 'timestamp', '/WEB-INF/recursos/javascript/plugins/timestamp/' , 'plugin.js' );
CKEDITOR.replace( 'area-paragrafo',
{
extraPlugins: 'timestamp'
});
});
I'm using Java with Tomcat (and Eclipse IDE), and my directory structures are as follow:
I already tried to set the following path:
plugins/timestamp/
But this is giving me:
Error: [CKEDITOR.resourceManager.load] Resource name "timestamp" was not found at "https://cdn.ckeditor.com/4.6.2/full-all/plugins/timestamp/plugin.js?t=H0CF".
I also tried the following path:
/plugins/timestamp/
And:
Error: [CKEDITOR.resourceManager.load] Resource name "timestamp" was not found at "/plugins/timestamp/plugin.js?t=H0CF".
My HTML page:
<!DOCTYPE html>
<html>
<head>
<title>Page</title>
<!-- JQuery. -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<!-- MY FILES -->
<link rel="stylesheet" type="text/css" media="all" th:href="#{/css/estilos.css}" />
<script th:src="#{/js/codigo.js}"></script>
<!-- CKEDITOR -->
<script src="https://cdn.ckeditor.com/4.6.2/full-all/ckeditor.js"></script>
</head>
<body>
<div class="papel-simples">
<!-- CONTENT -->
<textarea th:text="${paragrafo}" id="area-paragrafo"></textarea>
</div>
</body>
</html>
Can somebody help me, please? Thanks in advance.

How do I test HTML DOM click() using Jasmine?

I'm pretty new to Jasmine testing, and I'm facing a small problem. I have a function like this:
"redirectPage.js"
function clickThis(){
document.getElementById("link").click();
}
How do I test that this function has been called / triggered in my test?
This is my test currently:
describe('Test redirectPage', function() {
beforeEach(function() {
loadFixtures("redirectPageFixture.html");
});
it(" checks if the clickThis() method is triggered", function(){
var spyEvent = spyOnEvent("#link", "click");
("#link").trigger("click");
expect(spyEvent).toHaveBeenTriggered();
});
});
But doing this, gives me this error:
TypeError: "#link".click is not a function
How do I fix this test?
Any help is greatly appreciated!
UPDATE:
This is my fixture:
<html>
<head>
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap-theme.min.css">
<script src="http://code.jquery.com/jquery.min.js" defer>
<link rel="stylesheet" href="css/navbar.css">
<link rel="stylesheet" href="css/searchControl.css">
<script type="text/javascript" src="src/main/resources/assets/js/redirectPage.js" defer>
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
</head>
<body onload="setTimeout('clickThis();',3000);>
<p><a id=link href = "www.google.com">click here</a></p>
</body>
</html>

I finally figured out what I was doing wrong. I was creating the spy on my object, but wasn't actually calling the function that i needed. If any one is interested, this is my test case now:
it(" checks if the clickThis() method is triggered", function(){
var spyEvent = spyOnEvent("#link", "click");
clickThis();
expect(spyEvent).toHaveBeenTriggered();
});
Thank you everyone for your inputs! :)

javascript: Getting "DOM Exception 9" while creating custom event

I'm using PhoneGap to develop an android app. in the index.html I load a js file like this:
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<link rel="stylesheet" href="styles/style.css" />
<link rel="stylesheet" href="styles/loading.css" />
<script src="scripts/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="scripts/cordova-2.5.0.js"></script>
<script type="text/javascript" src="scripts/readImages.js"></script>
<script type="text/javascript">
function onReadImage(event) {
//do something
}
document.addEventListener("onReadImage", onReadImage, false);
</script>
</head>
<body>
<!--
.....
-->
</body>
</html>
readImages.js
// Some codes
window.readImageEvent= document.createEvent("readImageEvent"); // line 4
readImageEvent.initEvent("onWeddingCakesRead", true, true);
//Some functions
readImageEvent.images = data;
document.dispatchEvent(readImageEvent);
but when I check LogCat, I see this error:
Uncaught Error: NOT_SUPPORTED_ERR: DOM Exception 9 at file:///android_asset/www/scripts/readImages.js: 4
Any ideas?

finally I found out the problem.
I changed the below code:
window.readImageEvent= document.createEvent("readImageEvent");
to:
window.readImageEvent= document.createEvent("Event");
Because "readImageEvent" is not a proper event type. This link could be so useful
about this issue.

According to developer.mozilla.org
The createEvent method is deprecated.
I guess, you can try something like this:
var readImageEvent = new CustomEvent(
"onReadImage",
{
detail: {
images: data
},
bubbles: true,
cancelable: true
}
);
document.dispatchEvent(readImageEvent);
More information about usage, compatibility, etc can be found HERE