I can't mimic this in a snippet, but use the following code to reproduce:
Windows 10 || Edge-version: 42.17134.1.0 || EdgeHTML: 17.17134
I'm using ES6-modules
import * as variable_name from 'file'
console.log(variable_name); //will return an [object module]
console.log(eval("variable_name")); //returns undefined error 'variable_name is not defined'
Chrome works fine this way.
SAMPLE HTML
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<script type="module" src="module.js"></script>
</body>
</html>
You define variable_name as a variable value so you should use it without quotation marks. Maybe the syntax rule is not so strict in Chrome so it works fine with quotation marks. You could modify it into console.log(eval(variable_name));, then it can work well in both Edge and Chrome.
Related
why is document.getElementById() not working in VS Code?? I keep getting this error: "Uncaught ReferenceError ReferenceError: document is not defined". I'm new to VS Code but I'm assuming the reason It's not working is that I need to install some extension to make it work. The same code is working on Replit but not VS code. I installed JS(ES6) Snippets, Open-in browser, Live Preview and Live Server. It's very simple 2-line code just to experiment but it's not working. It's driving me crazy!
let head = document.getElementById('change')
head.innerText = 'hello'
I bet that you are not running this in an index.html file in the browser, so this is not VS Code problem, you are probably running this in a node console or something, there is no html or document in what you are trying to test and that is why you are getting this error.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="styles.css">
<title>Document</title>
</head>
<body>
<h1>HELLO</h1>
<hr />
<h2 id="change"></h2>
<script>
let head = document.getElementById('change')
head.innerText = "why isn't this working?";
</script>
</body>
</html>
Definitely has nothing to do with VS Code.
Make sure your html file is referencing your javascript file.
<!DOCTYPE html>
<html>
<body>
<h1>This is my HTML file</h1>
<script src="script.js"></script>
</body>
</html>
The script element should be in your html with the name of your js file
<script src="script.js"></script>
This not the vscode issue please check you are running the right file
Getting this error in the Devtool(Console).
Error handling response: TypeError: self.processResponse is not a function
Issue Solved: It seems like due to the (What runs) chrome extension, this issue is occurring.
just by simply deactivating WhatRuns chrome extension, resolved the issue for me.
Had the same issue running a site internally. Seems like that extension needs to be updated.
Error handling response: TypeError: self.processResponse is not a function
at chrome-extension://cmkdbmfndkfgebldhnkbfhlneefdaaip/js/notification.js:154:10
and this references index.html line 1 as the source of the error pointing back to the notification.js file called by that extension.
and this was on a bare html file:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Javascript Debug Challenge</title>
</head>
<body>
<!-- <script src="/part-1.js" type="text/javascript"></script>-->
<!-- <script src="/part-2.js" type="text/javascript"></script>-->
<!-- <script src="/part-3.js" type="text/javascript"></script>-->
<!-- <script src="/part-4.js" type="text/javascript"></script>-->
<script src="/part-5.js" type="text/javascript"></script>
</body>
</html>
i just started a new html project as any other day, but totay i was suprised with scope colision in javascript. The point is i'm trying to declare a variable called top, but i think that i had already declared it in another file and i would like to know if there is a fast way to find this file and fix it.
This is my html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>day one</title>
</head>
<body>
<h1>hiii</h1>
<script src="script.js"></script>
</body>
</html>
This is my javascript:
let top = [0, 0, 0]
When i open the devtools and look at the console there is an error message there: script.js:1 Uncaught SyntaxError: Identifier 'top' has already been declared (at script.js:1:1)
So i tried to console.log() the top variable and the output was the window
console.log(top)
// same thing as
console.log(window)
So i think that the best approach is trying to find original file where the top variable is, any ideas?
I don't know what to do ;-; HELP PLEASEEEE
top is a built in global property of the window. So you can't use it as a variable name when running in the browser:
https://developer.mozilla.org/en-US/docs/Web/API/Window/top.
I wanted to use the web components in my Word addin but I have an error that appears with a simple test, the error is the following:
Unable to get property 'define' of undefined or null reference.
Thanks in advance !
Test.js
class MyProduct extends HTMLElement {
constructor() {
super();
this.innerHTML = "hello";
}
}
window.customElements.define('my-product', MyProduct); //The error is just here
Test.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
<title>Word Add-In with Commands Sample</title>
<script type="module" src="Test.js"></script>
</head>
<body>
<my-product></my-product>
</body>
</html>
window.customElements.define('my-product', MyProduct);
// Unable to get property 'define' of undefined or null reference.
The JavaScript API for Office is not the same as the FireFox/Chromium/Safari Browser APIs
The undefined error says: There is no customElements API on the window element.
(there is no Browser window either)
To see what you can do with JavaScript in Word see: https://learn.microsoft.com/en-us/javascript/api/word?view=word-js-preview
For now; no Custom Elements in Office AddIns.
My dygraph code does not work on IE8. The Console shows this error:
SCRIPT5009: 'CanvasRenderingContext2D' is undefined
dygraph-combined.js, line 2 character 13300
This is the line that crashes in "dygraph-combined.js":
CanvasRenderingContext2D.prototype.installPattern=function(e){if ...
The graph is correctly displayed on IE9 and IE7, using the exact same code.
None of the possible solutions that I have researched have worked yet (many of them being just "include excanvas.js").
Edit1: after David Kiger's feedback, I have tried formatting the header exactly as required, but it still does not work. I have also removed Yii's bootstrap to isolate the problem. This is the exact code:
<!-- DOCTYPE html -->
<HTML><HEAD>
<META content="IE=EmulateIE7; IE=EmulateIE9;" http-equiv=X-UA-Compatible>
<META content="text/html; charset=utf-8" http-equiv=Content-Type>
<SCRIPT type=text/javascript src="/js/dygraph/excanvas.js"></SCRIPT>
<SCRIPT type=text/javascript src="/fonto/js/dygraph/dygraph-combined.js"></SCRIPT>
</HEAD>
Commenting this line in excanvas.js did not work either:
//el.style.overflow = 'hidden';
Edit2: SOLVED!
So I had to combine both solutions:
Format code for IE...
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7; IE=EmulateIE9;">
...AND commenting the line in excanvas.js
//el.style.overflow = 'hidden';
The order is also very important:
First excanvas.js
Then dygraph-combined.js
Thank you so much for your feedback.