This is a really strange issue that I've been trying to figure out for several days with no luck. It only happens on slow iOS devices, it doesn't happen every time, and it only happens when using minified JS code (both Angular and my app code).
When the issue occurs it looks as though Angular just stops processing the code and leaves the "mustaches" on the page as can be seen in the attached screen shot. If I switch to using the non-minified versions of my JS files as well as the non-minified angular files then it works just fine. I've used Safari developer tools to debug this issue, but there are no exceptions thrown and it looks like all the data is being set correctly on the scope.
Any help/ideas with this issue will be greatly appreciated.
Related
I'm trying to debug my gatsbyjs code in visual studio code. I followed the docs and and tried slightly different approaches like https://github.com/Microsoft/vscode-recipes/tree/master/Gatsby-js.
I can start debugging and the site builds, but my none of my breakpoints in any of my files get hit, they get instead show up as unverified.
When pausing the debug process though, I (somewhat) randomly end up in the source code of any of the external modules, and there I am able to place breakpoints that do stop...
Is there maybe some setup step or something I'm missing to make it work on page components and other react components?
Thanks for any help!
Adding a
debugger;
statement in the JS react page components definitely works for me. But be reminded that in development mode (gatsby develop), some breakpoints will get hit on startup, while others are only hit on page request. This of course depends on where you place your breakpoints.
My DNN site is running 7.4.2 and I'm running the latest 2sxc, 08.05.06. I have this strange issue where when I try to edit any content items, instead of displaying the edit dialog, it's now just displaying a bunch of javascript.
Before:
After:
As far as I know nothing has been deliberately changed on the site and I'm not seeing any errors in the browser console related to the module. No errors are showing in the Event Log either. I've tried reinstalling the latest release overtop to try to repair anything that may have been corrupt or missing but that didn't solve the issue. Any ideas what might be happening here?
The JavaScript inside the ui.html seems to show, instead of run. I believe that this file is somehow damaged, that the script tag isn't open/closing correctly.
-- correction --
To anybody reading this - it turned out that the web-server of this user was reconfigured, causing HTML files to be handled as plain-text. So this was a user bug.
Recently I've been setting up a development stack for React using Webpack (new for me) and of course wanted to benefit from all of the shiny conveniences that it provides (which are by the way great!). Among tons of resources I dug on the internet, the particularly good one I found was the React Webpack Cookbook, with which every step went like clockwork. However I stumbled across a hitch that has been taking me several hours to try to solve, not being able to find a solution in the aforementioned page, nor any other source: the expose-loader wouldn't expose React to global scope in Chrome (not tested on other browsers) therefore not allowing React DevTools extension to run. I tried mixing all the steps from the Cookbook, using different versions of React, minified/unprocessed, nothing worked.
The problem was trivial when discovered, but the source of the problem tricky to find: all the time I was using the localhost:8080/webpack-dev-server/ version of my development page, as suggested by the Cookbook, because it allowed me not to bother with the inability to inject <script src="http://localhost:8080/webpack-dev-server.js"></script> into html-webpack-plugin index file generator and provided sort of a nice status bar. It works perfectly since I switched to localhost:8080. Unfortunatelly I wasn't able to make it work with the localhost:8080/webpack-dev-server/ version, though I think it has something to do with the fact that under this url the page is loaded into a frame.
I am an AngularJS newbie. I have an AngularJS app that causes the browser to report 'Page has become unresponsive'. What are the steps I should take to debug and find what is causing this behavior?
(I am asking this way, rather than posting code and having someone solve my problem, so I can learn how to solve similar problems for myself in the future)
you can check few things if page goes unresponsive
check the page watch count or here (I prefer implementation in link 2)
once you know the watch count, try reduce the watch count if its too much
can you use one-time binding (hence reducing the watchers) read here
if you have ng-repeat and need two way binding & use track by
Based on the information you provided, I think that the error isn't related to AngularJs itself. You might see some information on this site, which describes clearly how to solve this issue.
What are the steps I should take to debug and find what is causing this behavior?
Typically, the most common way to debug AngularJs application is to use Chrome Dev tools, inspect element. It allows you to put any breakpoints in order to verify your application.
Alternatively, if you are using Chrome, you could use AngularJS Batarang which is very great chrome extension to debug your AngularJs app.
Usually AngularJS causes the browser to be unresponsive when there are too many watches.
There is a Chrome extension AngularJS Batarang that allows the inspection of each binded expression.
You can view the time required for each expression to load (both in ms and as a percentage of total application load).
Take a look at these articles:
Removing the Unneeded Watches
Debugging performance problems in AngularJS with Batarang and Chrome DevTools
And at this module BindOnce.
I'm using textAngular as a WYSIWYG text editor in an angular app. It is a fantastic library that is essentially plug and play. It works perfectly in Chrome and Firefox.
The problem is when I attempt to paste some text into the textAngular window in IE it simply doesn't work. It doesn't raise any console events, throw any exceptions or anything. On the network, it calls 4 URLs, which are then all aborted. They are:
http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css
http://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css
http://fonts.googleapis.com/css?family=Roboto:400,300
http://www.textangular.com/css/style.css
This network activity does not happen in Chrome and Firefox. So, I think that is where the problem is. But for the life of me I can't figure out what is going on. It doesn't look like this problem has been reported to the textAngular team or has been asked on stack overflow.
Does anyone have an I idea of how I can remedy the situation?
Edit:
Here is a plunk replicating the situation. It is the demo from the github repo, almost verbatim (the link to the textAngular links were dead, and I got ride of the initial text). I'm pretty sure that it is just a problem within the 1.2.2 library and I'm going to report a bug. The version on the main page is 1.2.0. Thanks for you help!
I tested your solution on IE 8,9,10 & 11 without any issues. I did however notice it the page was not formatting correctly no IE. It could be an issue with escape characters.
If you could provide some more details about your system, for example: IE version, the code you tried to paste etc. I think I may be able to sort this one out.