When i execute a JS code in typescript, i get the following error:
ORIGINAL EXCEPTION: TypeError: Cannot read property 'setAttribute' of
null
But It works perfectly in JS without any errors.
<HTML>
<path id="border" transform="translate(125, 125)" style="stroke:white; marker-end:url(#InverseSemicircleEnd);"/>
</HTML>
TS:
document.getElementById("border").setAttribute("style",dec);
But not sure, why it results in error on TS. I also tried to change the name of the property for this ID, but no luck. Can some one help me in explaining on what i'm doing wrong here.
Thanks For your support
Regards
Suresh
Because document.getElementById could return null, you need to check if it is different from null.
const myEl = document.getElementById("border");
if (myEl !== null) {
myEl.setAttribute("style",dec);
}
OR
document.getElementById("border")?.setAttribute("style",dec);
If you are sure that the element is defined and you want to avoid the check, use the ! (Non-null assertion) operator:
document.getElementById("border")!.setAttribute("style",dec);
Make sure that the browser has loaded before querying elements because not doing so could lead to a runtime error.
I use the following way to solve :
hideDesPan(){
let pan = (<HTMLInputElement>document.getElementById('showPan'));
pan.style.display = "none";
}
Related
TypeError: elem[prop] is not a function
E2E testing in webdriveio. I want to click a button inside an iframe.
let iframe = browser.$('#fullmessage')
browser.pause(1000)
browser.switchToFrame(iframe)
browser.setTimeout({ implicit: 10000 })
let clickAgree = $('a[class="button is-success"]')
clickAgree.click()
browser.switchToParentFrame()
browser.pause(3000)
I was facing same error and when debug more using REPL found that the issue could be due to 2 reasons:
selector is returning array of elements and so it was not able to call the method used.
the method being called on element does not supports.
For example with following code:
$('.some_class').$$('input').getValue();
was getting error - Uncaught Error: elem[prop] is not a function. Using $('.auto_test_class').$$('input')[1].getValue(); works. But its better to use some Id or xpath.
Hope this might be useful for someone facing same issue :)
Hi i faced with the same problem, but in async. The reason is that you need
to await already defined element as parameter:
get iframe() { return $('.iframe'); }
await browser.switchToFrame(await this.iframe);
Because switchToFrame works only with element, not with promise.
Maybe for someone it will be useful.
https://codepen.io/mdaw11/pen/rNMbdqd
Created this little issue tracker for public use, works fine in Codepen, however once I try to open it in Chrome browser, the console outputs error
'Uncaught TypeError: Cannot read property 'length' of null
at fetchIssues (main.js:71)
at onload ((index):10)'
This tells me that there is something wrong with my fetchIssues(); perhaps var issues = JSON.parse(localStorage.getItem('issues')); isn't outputting what I expect it to be?
Any help would be much appreciated!
Could be fetchIssues() is being executed too early and could also happen if you don't have anything saved to the localStorage yet. Also double check what localStorage.getItem('issues') returns.
To fix that error you could try something like:
var issues = JSON.parse(localStorage.getItem('issues') || '[]');
I have tried to write some code in JS but, when I hover my mouse, the error "Cannot set property 'innerHTML' of null at ahint" is seen. I have read that such an error can occur because Chrome compiles/renders the JS code before the Div is even created. Therefore, I have put it on the bottom to check it. Unfortunately, putting it on the bottom has not solved my problem. Maybe someone more experienced will understand it.
var hint = "Hello";
function ahint()
{
document.getElementById('#randomhint').innerHTML = hint;
}
<div id="randomhint" onmouseover="ahint()">!</div>
<script type="text/javascript" src="main.js"></script>
</body>
Remove the # from the identifier:
var hint = "Hello";
function ahint()
{
document.getElementById('randomhint').innerHTML = hint;
}
You have likely seen the # in code that uses jQuery or a similar library, as in $('#randomhint'). That’s how those libraries know that you mean to use an id and not, say, a tag name.
But you do not need (and cannot use) it when using getElementById (which is part of “vanilla” JavaScript). With getElementById, only the actual id value ("randomhint") belongs there.
I have been trying to figure out this particular problem in my developer tools, but I've had no luck thus far. I have an error on one of my js files that says
Uncaught TypeError: Cannot read property 'value' of null
The following error refers to the 1st variable of dt_version below. The particular thing is if I comment out the first line of code. I get the same error on the following variables of offload1 and offload2. The variable is a number that I am trying to get passed over. I run this function on my body when the page loads...onload=updatetotal();
function updatetotal() {
var dt_version = document.getElementById("dt_version").value-0;
var offload1 = document.getElementById("capacity_offload1").value-0;
var offload2 = document.getElementById("capacity_offload2").value-0;
var offload3 = document.getElementById("capacity_offload3").value-0;
}
If a run an if statement looking for document.getElementByID("dt_version");...it defaults to false..so its not being carried over though on the previous page, I can see its input fine with the value in it. What am I missing here guys?
This error means that the id dt_version does not exist. Check your html to make sure it is there:
var dt = document.getElementById("dt_version");
if (dt){
// do your stuff
}else {
console.log("dt does not exist")
}
Another cause for this error may be- as you are calling the javascript function on page load there is a possible chance that your control is not yet completely rendered to the page. A simple solution is just move that control to the beginning of the page. If it doesn't work then an reliable solution is, call the function inside jquery $(document).ready().
I keep getting the same error when I try to set an attribute but only if the attribute's value already the same as the value I am trying to set it to:
Uncaught TypeError: Object function (obj) { return new wrapper(obj); } has no method 'has'
For example I have the following line:
var s = new SampleModel({"language": "en"});
s.set("language", "en") // this produces the above error
Anyone have any insight into this problem? I am currently using the most recent version of Backbone.js 0.9.1
#ggreiner and #nikoshr are right... they should have posted answers instead of comments, though.
this error is caused by having an outdated version of Underscore.js. you need to upgrade it to v1.3.1 for use with Backbone v0.9.x
http://documentcloud.github.com/underscore/