Why is nothing in scope in the protractor debugger? - node.js

I'm on OSX, with protractor version 1.3.1 installed. If I put browser.debugger() in my test and run with
$ protractor debug test/protractor.conf.js
I go into the debugger screen. Then I hit "c" and it seems to stop at my breakpoint.
However, nothing seems to be in scope, everything comes up as undefined.
debug> browser
ReferenceError: browser is not defined
If I enter 'repl', I go into a node repl loop (I think?) and I can look at the browser object, but none of my local variables from the test seem to be in scope, they all come up as undefined.
Any suggestions?

Yes, to inspect variables / evaluate code you need to go to repl first. Your variables might be optimised out by v8 if they are not referenced in the current scope. Possible solutions: reference them in code, add with({}) block, use try/catch or some other ways

Your local variables don't show up because browser.debugger doesn't pause in the same local scope - what it does is add a command to the control flow queue to debug when the control flow gets there.
This is desirable so that if your test does
someElem.click();
browser.debugger();
otherElem.click();
That it will pause after the click has occurred, instead of just after it has been scheduled.
You can still use debugger; directly if you want to investigate local variables.

Related

Is there a way to use a global variable for the whole npm project?

I need to use a variable between node modules folder and src folder.Is there a way to use a variable to be used within the whole project?
Thanks.
Typically this is done with process environment variables. Any project can look for a common environment variable and handle that case accordingly, as well as the node modules of said project. As long as they agree on the name, they all share the same environment. Have a good default, don't force people to set this environment variable.
The environment can be set using an environment file (do not check this into source control!), on your container or cloud configuration, or even right on the command line itself.
TLOG=info npm test
That is an example that I use frequently. My project runs logging for the test cases only at alert level - there are a lot of tests so it makes the output less verbose. However, sometimes while developing I want to see all the logs, so my project is looking for an environment variable TLOG (short for "test logging") and I can set it just for that run! Also no code change is needed, which is nicer than JavaScript variables that need to be set back to original values, forget to be turned off, etc.

How to get Flow type checker to detect changes in my files?

So Flow only works correctly the first time I run it, and then I have to restart my computer before it'll work correctly again.
Specifically, the problem I'm seeing is that we are using the Flow language to add type annotations to our JS code. Our linter script is setup to run flow type checking among other things. However, when I fix an issue in my code and then rerun the linter script, it still comes back with the exact same errors... BUT when it shows the piece of code where the error is supposed to be, it actually shows my updated code that's fixed.
So as an example, I had a file I copied into the project, that I didn't think I really needed, but maybe I would. So I copied it in just in case. Well then it came up with a bunch of linter errors, so I decided to just delete the file since I didn't really need it. So then I run "yarn lint --fix" again, but it's still complaining about that file, EVEN THOUGH THE FILE DOESN"T EXIST! Now interestingly, where the linter output is supposed to show the code for those errors it's just blank.
Or another example, let's say I had a couple of functions in my code:
100: function foo() {}
...
150: function bar() {}
And foo has a lot of errors because it was some throw away code I don't need anymore and so I just delete it. So the new code looks like:
100: function bar() {}
Well I rerun the linter and get an error like:
Error ------------------------ function foo has incorrect
something...blah blah
src/.../file.js
100| function bar() {}
I also tested this out on a coworker's machine and they got the same behavior that I did. So it's not something specific to my machine, although it could be specific to our project?
Note: There doesn't appear to be a tag for Flow, but I couldn't post without including at least one tag, so I used flowlang even though that's actually a different language :-( I'm assuming that anyone looking for flow would also use that tag since it's the closest.
The first time you launch Flow it starts up a background process that is then used for subsequent type checking. Unfortunately this background process is extremely slow, and buggy to boot. In linux you can run:
killall flow
To stop the background process. Then if you rerun the flow type checker, it will actually see all your latest changes.

Log statements in Node Module not getting printed

I am a new to Node JS. I have included a module via npm install '<module_name>. It was built correctly and there was no errors. Now, I wanted to debug it, so I placed a few console.log('some text') in code blocks of the module to see if the code by passes that line. Anyway, none of the log statements were displayed.
I am wondering if I have to compile or something the modules after adding the log staements. Am I missing something here.
Your console.log statements are not being run, this could be caused by many things.
Assuming you have added the console.log statements to the module code in the node_modules directory of your app..
does the module have src and dist directories and you have not edited the code that is actually being run? (this relates to needing to recompile, but editing the actual code that the module is running will be quicker and easier)
if this is in a server or long running script it will need to be restarted to load the changes
is this in a browser which might be caching the code (turn off browser cache)
is the code where you added the log statements actually being hit?
I would make sure I had a console.log statement in a part of the code guaranteed to be hit, just as a sanity check.
For anyone coming here in the future, try console.error instead of console.log. For some decided reason or another, log was being overriding by the library I was monkey fixing. Took me way too long to find the culprit.

Chrome DevTools error: "Failed to save to temp variable."

I am using Node Monkey to debug my NodeJS app.
It happens frequently that when I click "Store as Global Variable" in my Chrome Console it says "Failed to save to temp variable."
console.log({why:'dont', you:'work?'})
It happens also in this jsfiddle
1) Am I doing something wrong?
2) Why this happens?
Chrome: 50.0.2661.102 (64-bit)
OSX El Capitan 10.11.4
I can see two reasons why Store As Global Variable wouldn't work:
1. Wrong Console Context Selected
This is arguably a Chrome bug, but you can only store an object as a global if the console is set to the same context as the code that logged the object.
In practice this means you might need to select the correct IFrame or web worker.
For example, on jsFiddle:
In the normal jsFiddle editor page context I'm getting an error. But it works if I change the context to the contents of the fiddle itself:
2. Garbage Collection
In order for Chrome to give you a reference to the object the object still has to be in memory. If that isn't the case it can only throw an error.
However, I'm pretty sure that being shown in the console forces V8 to keep a reference to the value.
You need to create the object in the Console itself, as the reference to the object needs to be maintained by Chrome. Just put the following into the console instead:
{why:'dont', you:'work?'}
If you check out this revision where the feature was added, it says:
Adding ability to access objects from printed ObjectPropertySections
(console, scopes pane and etc.).
The problem, based on my understanding, is that console.log is outputting a string representation of the object, and just using object formatters to display it nicely. The object doesn't exist anymore. When you create an object through the console itself, Chrome is storing the object itself in memory. If you have paused on a breakpoint and have locally scoped variables, these can also be stored globally because they are also in memory.
One thing you could do in your code, if you haven't got circular references is:
console.log(JSON.stringify({why:'dont', you:'work?'}));
> {"why":"dont","you":"work?"}
In the Console, copy the output and paste it into a JSON.parse call:
JSON.parse('{"why":"dont","you":"work?"}');
> Object {why: "dont", you: "work?"}
The variable exists now in memory so you can store it.
press Ctrl+Shift+C and select any element inside the frame that prints the object, then try again.
This will fix the problem.

Make Greasemonkey throw error on undefined variable

I've recently switched from chrome to firefox for greasemonkey development. I have some problems with debugging.
The following func
I meant to write:
self = this;
but instead I wrote
this=self;
Self wasn't defined, so the script didn't run, however, nor did I get any javascript error. Why and can I get them somehow? I get some errors.
Unfortunately, Greasemonkey - and javascript in general, along with at least a few other non-compiled languages - do not give very good debugging errors... I can't count the number of times it tells me there is a missing ) at the end of an argument list that doesn't exist, and it turns out my error is elsewhere...
When a script of mine won't run I add an alert after any value assignments and if they don't alert or alert the wrong data I have found the problem... for your example above I would debug by:
this=self;
alert(self);
Although I would probably see the problem when I went to add the alert, but if I didn't notice - the alert either wouldn't pop up or it would have the wrong value... and if it didn't pop up, the error console would likely say self not defined.

Resources