Kind of getting desperate here.
I have a legacy testsuite using AngularJS (5.4.1) driven by Node 8.12.0.
I want to debug some tests but it seems impossible.
Control flow is enabled in the tests, so I followed the docs on the protractor website. Sadly, it does not work.
browser.pause() just get skipped and using browser.debugger() is deprecated from Node 8.
I decided to disable the control flow but I ran into another problem.
We go to a login page before accessing the application, and the angular debugger does not like that. When accessing the non-angular page, the debugger just quits, stating that angular is not defined.
I then turned to Google to see if there are any Chrome extensions that enable me to use the dev tools to test the locators, but to no avail.
Would be great if I can get the debugger working.
Thanks in advance.
Regards
Here is a setup for IntelliJ
(working directory is example)
Related
I have a chrome extension that I successfully loaded into my Cypress environment. It shows up successfully in my extensions and I can see that it is turned on. I know it is working because I can open a new tab in the same browser where Cypress is running and it is working fine and making changes to the UI.
The problem is, the main tab that is running the Cypress Test Runner is inside of an iFrame and I suspect that the chrome extension I have loaded cannot interact with it. I believe this issue reflects my problem. However, I tried that solution but with no luck.
There is a blog that I stumbled upon that talks about a solution for fixing this for the React Dev Tools Extension. The following screenshot explains:
However, the extension that I am using does not have some kind of Global Hook like __REACT_DEVTOOLS_GLOBAL_HOOK__ that I can take advantage of as far as I can tell.
I have no idea what to try next, if anyone can provide some guidance I would appreciate it.
I ended up using Puppeteer for testing this particular extension. Puppeteer does not run within an iFrame allowing the extension to be testable, also you can integrate it into Cypress. Its an annoying workaround but I'm not seeing a better way to do it.
I am attempting the Meteor/Angular2 tutorial here
If I make a change to a component the changes are not updated in the browser (Google Chrome); even if I do the following things...
Save changes and hard refresh browser.
Stop server and restart.
I have to clear the browser cache to get rid of the old data and load the new.
I'm pretty sure this should not be the case, as it creates a major problem for a developer.
This tutorial is using Angular2, Meteorjs, as well as a typescript compiler.
This is not an Angular issue.
My question is... Is the problem with meteorjs not triggering a hard refresh? Or could it perhaps be an issue with the typescript compiler?
Also, how could I fix this?
I'm running
Typescript Compiler: netanelgilad:angular2-typescript
Meteorjs: 1.2.2
Google Chrome: Version 47.0.2525.0 canary (64-bit)
UPDATE:
I tried a normal .js file and everything works as expected. This means its the Typescript Compiler: netanelgilad:angular2-typescript.
I'll check out the package and see what I can find.
If You are using
http-server
then this may be the issue of http-server as it always store the data in cache.
In my case i was using http-server and this problem occured.
You can fix it by selecting the disable cache option in developer tools(chrome).
I'm using https://github.com/ride/ember-stripe-service add-on and everything worked nicely until Ember 1.10.1, but since Ember 1.11.0 Ember's run loop start crashing in E2E testing saying that we were trying to access a destroyed object, I have been trying to fix it but I couldn't so I made a PR https://github.com/ride/ember-stripe-service/pull/32 reproducing the error in tests/dummy and tests/integration but neither they know how to fix it, please help.
We think is something related with Stripe.js (https://js.stripe.com/v2/) because they embed an Iframe when the script in loaded in the browser.
I am working on a simple application in RhoMobile and I am using AngularJS with it.
When defining routeProvider, I have come to the strangest issue I have seen.
I tried many things, like chaning the path for templateUrl defining an explicit one, but with no success. But if I use template property instead of templateUrl it works.
I am getting this error:
Error: 'undefined' is not a function (evaluating '$sce.getTrustedResourceUrl(templateUrl)')
I am using AngularJS v1.2.16 and I am out of ideas.
EDIT: I set up an example RhoMobile application with angular-seed which has the error, you can find the application here
UPDATE:: I got reply from RhoMobile core developers that this will be fixed in 4.2
It works just fine when served statically, so RhoMobile is probably screwing up the origins, and running your app into CORS issues.
git clone https://github.com/TheCodeDestroyer/rhomobile-angular
cd rhomobile-angular/
python -m SimpleHTTPServer
open "http://localhost:8000/public"
# click around... it works!
Indeed, issue has no any relation to rhomobile code. Rhomobile used opal.rb/opal.js conflicted with angular.js until RMS4.2. Started from RMS4.2 opal.js is not in use anymore. So there may be another reason for your issue.
In case you run your application using RhoSimulator on windows it may be a bug with toLowerCase() method of String class. It looks like the bug is in the QTWebView component used for RhoSimulator. Just discovered it and fix is in the progress. Issue appears only on windows. On Mac OS X everything performing correctly.
Try to evaluate following expression in web console of RhoSimulator:
"RESOURCE_URL".toLowerCase()
In case it evaluates as "resource url" the angular.js will not work.
Watch for update in your RhoMobile support ticket.
It doesn't look like you're including the ngSanitize module.
I am writing an Angular app, with bit and pieces of JQuery plugins around the place.
Some of the logic is pretty complex and I'd like to have some debug logging that I can leave in the codebase that won't print out to the console in production.
What are people using to achieve this these days? I know Angular has its own logging but this logging needs to be across both the Angular stuff and the JQuery stuff. I can't rewrite the JQuery to be 'angularised'.
How can I best achieve this?
Maybe you can try chrome develop tools?
WIN： ctrl+shift+j
MAC: command+shift+j.
sources - > your script - > double click to add a breakpoint -> refresh
Here is a shortcut.
Definitely breakpoints but you also need to check out
Batarang - chrome extension developed by angular team. I find it extremely useful for scope inheritance. It does crash now and then but it is still quite useful.