TypeScript doesn't have window.eval() - javascript

In JavaScript I can do:
window.eval(userInput)
in a client-side .js file without any issue.
But in TypeScript, window.eval() does not exist. I get the error:
property eval does not exist on type window
How can I get around this issue?
The reason I want to use eval() is to execute some user created code. The eval call must be done on a global scope because the user code relies on some other code that I have already previously loaded with <script> tags.

There are a couple of ways to do this.
Use type assertion (Type unsafe, but quick and easy):
(window as any).eval("1 + 1");
Or you can modify the window declaration as described in this issue (Type safe)

Related

How to access flow variables from javascript in power automate

I'm working on a power automate flow and I'm having some trouble. I copied some text to my clipboard in the flow and i asigned it to a variable in my flow. I'm trying to parse the variable using the javascript scripting feature but i'm getting a syntax error whenever I try to use the %variable% syntax in javascript. I used the variable button in the text editor they give you to add the variable to my script but even something simple as var res = %SimResults%; returns an error C:\Users\$me\AppData\Local\Temp\Robin\nkwrgcdoxrp.tmp(1, 11) Microsoft JScript compilation error: Syntax error
It seems that even though I Should be able to access my flow variables from Javascript it throws a syntax error when I try
You'll need to put quotes around it ...
var res = "%SimResults%"
... it treats the variables as more of a find and replace within your Javascript code, therefore, you need to do the work to ensure the correct encapsulation, etc. exists.
This may not solve your problem though depending on the complexity of what is contained within the variable.
If you have additional quotes, etc. you may need to escape them prior to putting them in the Javascript task IF they exist within the string ... just be mindful of that.

Debugging JavaScript code that uses ES6 Modules

TL;DR: How can I access variables/functions/names that are defined in ES Modules from the debugger?
More context: I'm a relatively experienced JavaScript programmer, but new to Modules. I've followed the tutorial at MDN here: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules. They have a good set of examples here: https://github.com/mdn/js-examples/tree/master/modules
In that collection, say in the "basic-modules" example, (live code here: https://mdn.github.io/js-examples/modules/basic-modules/) there is, for example, a function called random in the file modules/square.js. Suppose I want to execute that function in the debugger, just to try it out, or because it's my code and I want to test/debug it, or I want to demonstrate to another coder what the function does. All the stuff you expect to do in a REPL or debugger. Is there a way to do that? I've tried both the Firefox debugger and the Chrome debugger, with no luck.
Back in the pre-Modules era, that code would be put into the global namespace (making access easy) or it would be locked up in an IIFE (making access impossible) or maybe in some home-made module system (access depends). I am hoping that the new Modules system still allows the debugger access to the names inside modules.
Thanks.
It says in the docs:
Last but not least, let's make this clear — module features are imported into the scope of a single script — they aren't available in the global scope. Therefore, you will only be able to access imported features in the script they are imported into, and you won't be able to access them from the JavaScript console, for example. You'll still get syntax errors shown in the DevTools, but you'll not be able to use some of the debugging techniques you might have expected to use.
To take your example from before, you'll need to invoke that function from a scope where it is visible, i.e where it's been imported:
import { random } from 'path/to/square.js'
debugger; // you should be able to invoke random() from here

Can't set values on `process.env` in client-side Javascript

I have a system (it happens to be Gatsby, but I don't believe that's relevant to this question) which is using webpack DefinePlugin to attach some EnvironmentVariables to the global variable: process.env
I can read this just fine.
Unfortunatley, due to weirdnesses in the app startup proces, I need have chosen to do some brief overwritting of those EnvironmentVariables after the site loads. (Not interested in discussing whether that's the best option, in the context of this question. I know there are other options; I want to know whether this is possible)
But it doesn't work :(
If I try to do it explicitly:
process.env.myVar = 'foo';
Then I get ReferenceError: invalid assignment left-hand side.
If I do it by indexer (which appears to be what dotenv does) then it doesn't error, but also doesn't work:
console.log(process.env.myVar);
process.env['myVar'] = 'foo';
console.log(process.env.myVar);
will log undefined twice.
What am I doing wrong, and how do I fix this?
The premise behind this attempted solution was flawed.
I was under the impression that webpack "made process.env.* available as an object in the browser".
It doesn't!
What it actually does is to transpile you code down into literals wherever you reference process.env. So what looks like fetch(process.env.MY_URL_VAR); isn't in fact referencing a variable, it's actually being transpiled down into fetch("http://theActualValue.com") at compile time.
That means that it's conceptually impossible to modify the values on the "process.env object", because there is not in fact an actual object, in the transpiled javascript.
This explains why the direct assignment gives a ref error (you tried to execute "someString" = "someOtherString";) but the indexer doesn't. (I assume that process.env gets compiled into some different literal, which technically supports an indexed setter)
The only solutions available would be to modify the webpack build process (not an option, though I will shortly raise a PR to make it possible :) ), use a different process for getting the Env.Vars into the frontEnd (sub-optimal for various other reasons) or to hack around with various bits of environment control that Gatsby provides to make it all kinda-sorta work (distasteful for yet other reasons).

Make JSHint to show error in function's name

I read a lot about JSHint configurator but missed one moment that would be helpful for me. For example when i write document.geetElementById (there is an extra e) it says nothing. Is there any way to make JSHint to show errors like this? Thanks.
No, you cannot configure it like that, because it can't determine whether document has a geetElementById method or not. (What if you tried adding one, that has almost the same name as a built-in function it should know about?)
On the other hand, if you mistyped document (depending on your settings) you would get a warning, because jshint looks for a variable declaration by that name. document, of course, is an exception, because you don't define it in your code, but it's globally available - jshint knows about this either because you set it using the globals option, or you've specified a browser environment.

MochaJS 'Window Is Undefined'

In MochaJS, I keep receiving this error when importing my JS file for testing:
ReferenceError: window is not defined
My js file is written with the following pattern, which I believe is best practice for defining window level variables:
if (typeof window.myVar === 'undefined') {
window.myVar = ...
}
According to:
What is the correct way to check if a global variable exists?
At any rate, it seems reasonable that one should be able to make a reference to 'window' at any point within a js file without breaking a unit test.
I do NOT want to simulate going to a URL (as zombieJS tutorials seems to assume), nor can I get zombieJS or phantomJS to create a mock of the window object.
Inserting
var window = {};
Into my unit test has no effect.
Other posts that seem to deal with this, such as Defining Window for Testing in Mocha make absolutely no sense to me.
How do people deal with this?
I figured it out!
Basically it involves passing whatever the root object is as "this" to the function that is being unit tested.
I wrote a more comprehensive blog post on it.

Categories

Resources