How to convert Angular JavaScript code into a native Windows application? - javascript

I want to convert an Angular JavaScript app into a native Windows application but I don't know how to do it. I heard that electron could be used for this but I don't know how to use electron.

Despite electron there is another solution called nativefier. It is actually quite simple and you don't have to learn a new framework like electron.

As the comments pointed out already, this is not possible.
Why?
JavaScript can't run directly on the machine, neither do HTML and CSS. You need a browser that can understand those languages and turn them into commands your computer can understand.
So your only way to run an Angular App without using chrome or Firefox or whatever browser, is Electron. It's basically a chrome browser plus your custom Angular app packed into an exe. So under the hood, it really just runs your code in a browser environment, but you have more control over it and no address bar etc.

Related

Testing apps made of electron application framework

I am new to JS and electron in general, always been a back end dev using languages such as java and C#, I briefly worked on an older Perl project as well.
I have been tasked to create tests for one of our newer apps made in electron, I know that it is a JS program using a chromium core, and there is a testing framework for it called spectron. When I checkout the documentation, it seems to tell me that I can only use JavaScript bindings that it provided to test electron with selenium. My question is, is there a way I can use selenium webdriver with C# to test an electron app instead of using JavaScript? Do I have a choice here?

How to run desktop app from browser?

I need to launch program from browser(like battlefield when you see dialog with confirmation of starting app). Should I make an extension or there is native way to do it with javascript?
If the basic idea is to launch a desktop app from the web browser, the first step is to create a new Registry in Windows and path a URL Custom protocol. And if you need it you can also send parameters by changing console arguments in your app and append the parameters in your html file.
You can check here:
https://weblogs.asp.net/morteza/How-to-run-a-desktop-application-from-a-web-page
check out: Running .exe from Javascript
There are cross-browser compatibility issues with executing a .EXE on a clients machine. i would suggest you look into alternative languages such as Java or even Flash. But it can be done in Javascript.
-normally i wouldn't answer a question like this, but i saw someone say it's not possible. ANYTHING is possible.

Interaction between Dart/Objective-C and Dart/Java

I read a really interesting article about how create cross-plateform app : http://www.skyscanner.net/blogs/developing-mobile-cross-platform-library-part-3-javascript
But I would prefer use Dart instead of Javascript, and I was wondering if it's possible to interact between Dart/Objc and Dart/Java (Android), in the exact same way that is showed in the article (run a Javascript VM to execute the javascript code).
Thanks
You can code it in Dart and use dart2js to output JS code then put that JS code in PhoneGap or Cocoonjs to get it on Android/IOS.
The article seems to show how its done with JavaScript. I am sure its possible to code a Dart mobile cross-platform library but it hasnt been done yet.
iOS does not allow 3rd party VMs to be included with your app. The only VM you have access to is the JavaScript VM that is bundled standard with iOS. Even Google Chrome on iOS is crippled in this way (they cannot include v8 on iOS).

Headless node.js javascript browser with screenshot capability?

Are there any headless browsers for node.js that support dumping a rendered page out to a file? I know phantomjs supports rendering to a file, but it doesn't run on node.js. I know zombie.js is a node.js headless browser, but it doesn't support rendering to a file.
I doubt you will find anything that is going to work as well as phantomjs. I would just treat the rendering as an async backend process and execute phantom in a subprocess from your main node.js process and call it a day. Rendering a web page is HARD, and since phantom is based on WebKit, it can actually do it. I don't think there will ever be a node library that can render a web page to a graphic file that isn't built upon an existing browser rendering engine. But maybe one day phantomjs will integrate more seamlessly with node.
Try nightmare, it uses the electron, it is way faster than phantomjs, and it's API easy and uses modern ES6 javascript.
This might look like a solution with a little bit overhead...
You can use the Mozilla Firefox with the MozRepl plugin. Basically this plugin gives you a telnet port to your Firefox which allows you to control the browser from the outside. You can open URLs, take screenshots, etc.
Running the Firefox with the Xvfb server will run it in headless mode.
Now you just have to control the browser from the outside with node.js. I've seen a few examples where someone has implemented a http alike interface inside the chrome.js of Firefox. So you can run a http command to get a screenshot. You can then use http calls from node.js. This might look strange, it actually is but might work well for you.
http://hyperstruct.net/2009/02/05/turning-firefox-into-a-screenshot-server-with-mozrepl/
I'm running a slightly modified version in production with Perl Mojolicious in async mode to trigger the screenshots. However, there is a small problem. When plugins are required they do work, however Flash usually gets activated when it's in the visible area, this won't happen so movies/flash things might not get initialized.
You might find this helpful, though it's not javascript specific.
There is a webkit-based tool called "wkhtmltopdf" that I understand includes javascript support using the QT web-kit widget. It outputs a visual representation ("screenshot" if you will) of the page in PDF format.
FWIW, there are also PHP bindings for it here: php-wkthmltox
The Chrome dev team has released Puppeteer which can be used in node. It uses Chrome with the headless option.
There's a project called Node-Chimera. Although it's not as mature as Phantomjs, it has all the features you have mentioned: it runs on native Nodejs, and allows you to render pages to a file. Repository is here: https://github.com/deanmao/node-chimera. It has examples to do exactly what you need.

Building a Windows app w/ embedded browser & JavaScript 'hooks'

I built a PHP / JavaScript website for a customer. Then they asked me to replicate it except as a standalone Mac application. I did this with an app that combined an embedded web server, PHP, and 'WebView' - a Cocoa-ish version of the WebKit web browser that I can embed in a standard app window. This all worked great - I got to reuse 10,000+ lines of PHP/JS code, which saved months off of re-implementing it all again in 'native' code.
Now they want a Windows equivalent. I'm reasonably confident I can get PHP and the web server to work. And I know embedding basic IE functionality is pretty easy.
However...in my Mac setup, WebView (via the windowScriptObject stuff) gave me the ability to call JavaScript methods from C++. For instance, I might call a JavaScript method from C++ to update the screen. Likewise I could set things up so that a JavaScript call in the browser could trigger a C++ method - I used this, for instance, to let a user click 'BROWSE' and pick a file path using a real, standard file browser.
So my question is, is there a Windows-based embedded browser setup that would let me interact with JavaScript in this same way?
(the JavaScript <--> WebKit interface is described in much better detail here: http://lipidity.com/apple/javascript-cocoa-webkit/)
Maybe try using something like Appcelerator Titanium so you'll be ready when your client says they want it to work on Linux, or iPhone, or Android.
Quoting Wikipedia: "Appcelerator Titanium is a platform
for developing mobile and desktop
applications using web technologies.
[...] Support for standards-based web
technologies: HTML, CSS and Javascript
on all platforms along with PHP,
Python and Ruby for desktop platforms.
Integrated support for popular
JavaScript and AJAX Frameworks
including jQuery, YUI, MooTools,
Scriptaculous and others."
Sounds like a perfect tool for the job.
When you embed the Web Browser Control (IE), your application code can simply call execScript (http://msdn.microsoft.com/en-us/library/ms536420(v=vs.85).aspx) on the window object. You can have your script call out to the application by using the window.external object from the script, and by using the ObjectForScripting (or C++ equivalent) from the application.
maybe Qt will be good for your case, also you have QtScript and can inject javascript with evaluateJavaScript
I found a great example on the web for invoking JS in my embedded browser from C...basically using COM-ish methods that let you get a DISPID from a script object, and then using the Invoke() method with that. This works great.
But it turns out I need to also call C++ funcs from my JS code. It appears this is possible, and after hours of messing around I think I almost had it - it's like the above in reverse - you create a COM object, then hook it to the browser's script object - but in the end I could not close the deal - I kept getting "library not registered" errors. Honestly I don't know COM well enough to do this right.
So then I, for the heck of it, tried building my first C# app. In about 20 minutes I had an app running with a browser where I could both invoke JS inside of it and have the browser invoke C# methods. Geesh. I'm a believer in .NET after this experience, and a confirmed non-believer in 90's Microsoft technology.
In the interest of completeness, I'd like to mention my Windows port of WebKit, which includes the various cross-layer features of WebKit on the Mac.
I posted some example code showing how to embed WebKit in a native WinAPI application, complete with JavaScript->C++ and C++->JavaScript examples.
The example is a tiny test case for a much larger application using embedded WebViews for major UI components. I can confirm that what you are doing is not only possible, but a great way to build an application.

Categories