angularjs client side app without a webserver solutions - angularjs

I have a small angularjs app, that reads data from a json file and shows it on the screen. I wanted to share this via dropbox to multiple people, so that they double click on the html file and open it on their browser.
Chrome will not allow you to run javascript from the file system and it needs to be started with
--allow-file-access-from-files --disable-web-security --allow-file-access
in order for the app to run.
Firefox and Safari both run the app without any issue.
I was wondering, since I am targeting windows systems predominantly, is there a way I can force the index.html file to be opened via firefox if the user has it installed, if not after asking the user's permission download it for him and then open the index.html file? Can I make an 'easy to understand and launch' exe file that does this for the user?
Being a java programmer, I am not sure how to go about doing this..

Related

Cypress can't load fonts from absolute url while open through its dashboard

I've a simple web server for e2e purposes, built with create react app and react app rewired.
Cypress runs perfectly against this web server, the only issue I am facing is about the fonts.
They are included with an external url.
Since I launch the web server regularly, the react application is able to be fed with the url for the proper fonts.
Once Cypress open the browser with the command cypress open the console log shows this error and fonts indeed are not loaded.
GET https://[URL.EXTENSION]/[FONT.WOFF2] net::ERR_EMPTY_RESPONSE
BEGIN EDIT
I noticed that the issue occurs on my company VPN and not on my regular network configuration, so as I already said, the fonts are not loaded just in the browser of Cypress, if I
view the website from a regular browser
access those fonts url copying them in the browser
any issue is occurring
END EDIT
Where is lying the error? Do I miss something in the configuration?
Thanks

Working interactively with WebExtensions in Firefox

I have a page which leads to other pages that loads mp3 files. I want to download them. All pages and links are build dynamically.
In a past I used Scratchpad but now it is deprecated and new API is here WebExtensions
I can't call browser.tabs.create from console. How can I interactively use WebExtensions in Firefox?
The code that used to be run from the Scratchpad can still be run from the Browser Console. The Browser Console can be open from the Web Developer menu or using Ctrl+Shift+J.

How to get file download complete status using selenium web driver c#

I am writing a automation script using selenium web driver for downloading multiple files one by one from a web site in Mozilla fire fox. I have downloaded first file successfully and next time I need to wait for download to complete. Can anybody help how to identify an ongoing download is completed using c# selenium web driver.? Since I am not getting the download complete status, I am unable to continue downloading next file.
Assuming you are testing file downloading in Firefox as you mentioned. Here is an approach to achieve what you want.
Open new window/tab in Firefox and navigate to 'about:downloads' directly.
i.e. driver.Navigate().GoToUrl("about:downloads");
You will get the list of downloads (i.e. already downloaded files and the file which is being downloaded currently.)
You will have to switch between your site tab and downloads tab.
Now on downloads tab, looking at HTML, you can easily find out in progress download using state or status attributes.
For example, for the first file in the list, if state="0" and/or status
contains the text 'remaining', it means downloading is in progress
So you can wait till state becomes state = 1 and/or status does not contain >the text 'remaining'
Refer the attached screen shot.
The explanation I gave here looks very high level, but I am sure this approach will work. It is simple too.
Let me know if you have any queries on this.

Angular app doesn't work when built with Phonegap

Background:
I've built a Angular Application that works fine on browsers.
On the frontend side I have HTML/CSS/Angular/Bootstrap, backend side is Web API. So it is completely separated.
I took my front code zipped it, used Phonegap to build android app. When I run it I can see the first screen of my web site. I've confirmed that the angular code there works, cause I can see it filtered navigation based on the fact the user is not logged in.
But when I try to go to any other page of my app I get an empty screen, so I tried to remotely debug it using PG remote debugger. Every time I try to load anything but my homepage I loose connection to my target. I haven't seen any JS errors in console.
This is the only thing in the logs:
"exception firing pause event from native"
"exception firing resume event from native"
Is there some part of configuration that I missed that could cause this behavior, or is there another way I can debug this?
Since you are using angularJS, I'm guessing you are using a webserver locally to make the app run on your browser, so everything seem to work fine
Although PhoneGap uses a file server to run your app on WebView, which is similar to just opening the index.html on browser without webserver. Bottom line is if you can make your app work on desktop browser by just opening your index.html without webserver then it will work when u build as PhoneGap app.
You might run into Cross-Origin issues when testing your app on browser, this will happen if your app is making REST API calls or if you are loading angularJS templates from another .html file, these Cross-Origin restrictions are taken care in PhoneGap build. So when testing on local browser you might want to open Chrome with web security disabled.
If you have developed your app using a webserver to test, then you might have absolute URLs for loading assets or hrefs, you will have to change these to relative URL paths.
For example, change <a href="/#/next-page"> to <a href="#/next-page">, or <img src="/images/logo.png"> to <img src="images/logo.png">

Running AngularJS app in WebStorm

Its been about a month since I started using AngularJS. I used to write my codes in SublimeText2 but i wanted to use WebStorm since it claimed to be more AngularJS friendly. I wrote a simple Hello World app and tried to run it but i couldn't get any hint of how to do it. I also don't have any knowledge about Node.js.Do i need Node.js to run app on WebStorm? Is Node.js a server? I tried going through tutorials on WebStorm page and also read few articles on Node.js but couldn't understand it. Can anyone explain it in a simple and understandable way?
You can open your HTML+JS application in the selected browser in WebStorm by clicking on the browser icon on the top right corner of the editor tab with index.html file opened (or any other html file you'd like to open in browser).
The same action could be done from the file context menu: Open in - Browser.
WebStorm will automatically start built-in web server for your convenience.
Note that you still can go to your project folder and execute your particular HTML file from there, the same way you would do it with the text editor.
Read more on working with AngularJS in WebStorm in this blog post.
If you have back-end in Node.js for your app, then you, of course, need Node.js installed. To run your node web app you need to create Node.js run configuration. More on it here.

Resources