Debugging Protractor tests in Node 8.x and higher - node.js

I've been hunting this one for a while, and I can't seem to find a clear answer.
Basically, it looks like when writing protractor tests (With Node 8 or higher) now everything has to be async/awaited to be able to debug the test. Is this correct?
As a test I did place await/async on one of my tests. To be able to debug, it required almost every single line to be awaited. If I missed a single line, it wouldn't debug properly. This made writing and debugging the test very janky.
Am I just missing something obvious, or is this really what I need to do?
I found the following video which seems to show this is required.
https://www.youtube.com/watch?v=6aPfHrSl0Qk&t=976s

Yes async/await is the way of the future. You can see in this question here that node 8 breaks a lot of what you're expecting to work to debug your code. To be able to keep up with the direction that Protractor is going you get to heavily alter all of your existing tests. It sucks, but I'll tell you what I've found helps.
Sounds like the first thing you need is to add the lint rule for no-floating-promises which will tell you which awaits you are missing. You can even set it to where only your e2e folder is affected by this rule, which helps if you aren't wanting to change your entire app.
Since now everything is a promise I also suggest replacing any forEach you have that involves promises. While you think that it should be sequential, it isn't. Pretty much anything and everything coming back from the browser is a promise, and if your types are outdated then some things that aren't marked as a promise will be anyhow. A for-of loop works as a decent replacement in this case. Why? The forEach will start every promise in the loop at the same time, causing WebDriver to error on you.
While you're at it, you will likely want to upgrade jasmine if you haven't already. If you're not yet on typescript 3.0 I have found that "jasmine-core": "2.99.1" along with "#types/jasmine": "2.8.9" will tell you when you are not awaiting a promise in an expect. It also does type checking in your expect, which is a plus over the older versions. These are very specific versions, the next ones up didn't seem to work with older versions of typescript.
Lastly, suggest looking at your protractor.conf and changing any beforeEach, afterEach, etc to be async and await whatever is in them.
I'm sure I've forgotten a few things, but that should get you started.

Related

Passing assymmetric matchers highlighted as wrong in the diff in Jest using toMatchBodySnapshot

When I use .toMatchSnapshot() if one matcher fails they are all highlighted in the diff making it hard to debug a test with multiple matchers. Passing assymmetric matchers are not supposed to be highlighted anymore according to https://github.com/facebook/jest/pull/9257.
When I use my debugger it looks like the code never makes it to the printDiffOrStringify from .toMatchSnapshot(). It uses other methods instead to print the diff.
Interested to hear if anyone else has dealt with this issue before I open a bug. Maybe I'm missing something. In the PR it sounds like this was solved generally for all expect functions.

Grunt still unable to handle ES6 imports?

I am working on a project under NodeJS that uses ES6 imports/exports (hence having set type: module in its package.json) and want to automate some tasks using Grunt. Now, I absolutely love grunt, but it appears to me that even in 2022 it is still not able to work nicely with ES6 modules? I always get an error saying "require() of ES Module /vagrant/Gruntfile.js from /vagrant/node_modules/grunt/lib/grunt/task.js not supported."
I understand where this is coming from, and I do understand there are workaround options - in particular, renaming Gruntfile.js to Gruntfile.cjs and passing it to grunt with the --gruntfile command line option. But that is incredibly annoying - it makes the command six times as long as it would be if I could just run grunt and be done with it. Pretty much the same goes for transpiling with something like Babel: That is exactly the kind of thing grunt is intended to handle in the first place, so it feels a bit like the horse riding the jockey. I feel like this should "just work".
Am I missing something here, or is grunt really unable to handle ES6 imports out of the box?
Actually, looking at the grunt github page it appears that a recent commit has addressed it.
I guess this issue will therefore be resolved in their next update.

Processing insists pause() is not a function, when it very much is

Aite, [first poster here, pls don't bash]
So, I'm using the sound library, which I of course remembered to import, and works just fine, proof being given by the fact that all the other functions I used work as expected and give no problems neither in editor nor in execution.
Except, of course, for this little bugger of a pause() function, which I wrote as per below using no different a syntax from all the other functions, only to find out Processing isn't very keen on accepting its existence.
Problem shows both using 3.3.6 and 3.5.
Oh, and also, apparently isPlaying() returns an int, what's up with that?
If, as I'd suspect, that single line below won't be enough code to couple with the info to get to the bottom of it, here's a Dropbox link to the code (since it uses a bunch of files) so you can test it yourself.
It kinda won't work if you try to run it as is tho because it messes up when trying to load all the songs (in the last line of setup), yeah I kinda need some help with that too... works fine if you only load the first one tho!
https://www.dropbox.com/sh/di7mwit0w2l4513/AABipGDAdoKx277f8Hg_ZfhDa?dl=0
(Please, don't expect clear, extensively commented coding. I started working on this way before I learnt that was a thing. Deeply sorry. Of course, you can ask away about anything baffling you)
What did I try, er, writing it well???
I used .play(), .stop(), the volume ones, and they all, as per stated, work fine.
import processing.sound.*;
SoundFile[] songs= new SoundFile[1];
void setup(){
songs[0]=new SoundFile(this,"Small Bump.mp3");
songs[0].play();
}
void draw(){
}
void keyPressed(){
if (songs[0].isPlaying()==1)songs[0].pause();
}
When I copy your code into my Processing editor, I get a couple errors:
songs[0]="Small Bump.mp3";
The sounds array holds instances of SoundFile, but you're trying to store a String value here. Maybe you're looking for the SoundFile constructor?
if (songs[0].isPlaying()==1)
The isPlaying() function returns a boolean value, but you're comparing it to an int value.
songs[i].pause();
You haven't declared this i variable anywhere. Probably meant for this to be a 0.
If I fix all of these errors, then your code compiles fine.
You might want to take a look at the reference for the Sound library here.
The Sound library I had installed was 1.3.2, or something of the likes.
All the references I'd read were for 2.0+.
Having updated that through the "add library" menu, all was solved.

TypeError after upgrading Node version

I'm trying to fix this problem for 6 hours now and I'm slowly starting to lose my mind, so please excuse my generic question.
First of all I am using:
Node: 8.10.0 | npm: 5.6.0 | Yarn: 1.5.1
I just upgraded my project to Node v8 and npm refused to install all dependencies, so i installed yarn which fixed the issue immediately.
My sources are compiled using Laravel Mix which utilises Webpack, Babel, ... internally.
Installing and compiling of my sources works perfectly fine now but for some reason my compiled js file is not working anymore (even if I downgrade to the previous Node version - 6.10.0).
Uncaught TypeError: fn.bind is not a function
at nativeBind (admin.js?id=8c4a6887899977ba8021:72515)
at initMethods (admin.js?id=8c4a6887899977ba8021:75849)
at initState (admin.js?id=8c4a6887899977ba8021:75617)
at Vue._init (admin.js?id=8c4a6887899977ba8021:76936)
at new Vue (admin.js?id=8c4a6887899977ba8021:77037)
at Object../resources/assets/js/admin.js (admin.js?id=8c4a6887899977ba8021:83350)
at __webpack_require__ (admin.js?id=8c4a6887899977ba8021:20)
at Object.1 (admin.js?id=8c4a6887899977ba8021:83790)
at __webpack_require__ (admin.js?id=8c4a6887899977ba8021:20)
at ./node_modules/babel-loader/lib/index.js?{"cacheDirectory":true,"presets":[["env",{"modules":false,"targets":{"browsers":["> 2%"],"uglify":true}}]],"plugins":["transform-object-rest-spread",["transform-runtime",{"polyfill":false,"helpers":false}]]}!./node_modules/vue-loader/lib/selector.js?type=script&index=0!./resources/assets/js/components/Autocomplete.vue.Object.defineProperty.value (admin.js?id=8c4a6887899977ba8021:63)
I have aboslutely no ideas what this error means let alone what causes it.
I know that the error message is pretty generic and could probably mean a lot of things but hopefully someone knows what it means given my context.
Thanks!
#Ortomala Lokni's answer pushed me in the right direction.
For some reason I thought my problem was related to my build scripts, npm, webpack or anything of that sort, which - of course - it was not.
Event though it wasn't really an API change as he suggested there was simply a wrong call to the VueJS constructor in my JS file which, for some reason, had been ignored by a previous release of VueJs but apparently not by the current one.
For anyone experiencing some weird bugs that just don't make sense I recommend the following:
First of all: Determine what really is your problem - if it compiles it is most certainly not related to your JS build
Comment out all of your JS code in your main file
The error should be gone at this point
Narrow down the error by trying to uncomment line by line (or block by block) and test your code after each uncomment
Even though this steps might seem obvious you can easily forget about such simple thing because of the million things that could possibly break when working with modern JS.
Sometime when you upgrade libraries you have to adapt some code. As Javascript is not a typed language, the problem does't appears at compile time but at run time.
In your case, I suppose that you have a problem similar as this one.
Check which libraries yarn has upgraded and verify if some API has changed.

Difference between lib and lib-cov in express?

I'm new to Node.js.
module.exports = process.env.EXPRESS_COV
? require("./lib-cov/express")
: require("./lib/express");
I know EXPRESS_COV returns a Boolean value, but what is the difference between lib-cov/express and lib/express?
process.env.EXPRESS_COV would be true when you're running tests and want to see the code coverage of those tests (i.e. how many lines of your codebase are actually executed when the tests are run). Mocha, the test framework used for express, achieves this through the use of jscoverage.
JSCoverage parses through your source code and adds a bunch of lines that look like this:
$_jscoverage[filename][line]++;
Naturally, that's rather confusing to have in one's source code, not to mention adding a lot of bulk. So we'd never want JSCoverage processed files in our codebase. Fortunately, JSCoverage places the modified files in a different directory. In this case, ./lib-cov/ instead of ./lib/. That way, we can see how effective our tests are and not clutter up our code.
For details on how this whole rigamarole runs, see TJ Holowaychuk's article.
If you want to avoid all of this, you can use Istanbul instead, as it's much simpler and doesn't require exceptions in index.js

Resources