Can Atom be a browser?


#1

Sort of continuing the discussion from How to get EditorView from Editor?:

I have started work on a new package. It is an example package to show how to bring up a tab with arbitrary HTML, This should work for an iFrame which a post on the thread above was asking for.

It will also act as a template for any new packages. I have several packages on my to-do list that need this capability.

I would guess that if you loaded a tab from a URL you would actually be turning Atom into a browser with a web page in each tab. Does anyone see any reason why this wouldn’t work?

It would be awesome to be able to have a customizable web browser. I can immediately think of many features I’d like to have. This would be to normal browsers what Atom is to text editors, yet it would still be Atom.

In other words Atom would be a platform, not just an editor. The next step is to get atom to run on a thin linux so it could be the OS, like the Chrome OS.


#2

The canonical topic on the subject is here:

There’s been a lot of discussion around this (and even attempts) over the months since Atom went public. My personal take on it is that getting Atom to display some HTML isn’t hard … but the gap from there to even the bare minimum of what people expect from a browser is a yawning chasm that most people simply don’t have the time nor energy to tackle.


#3

I guess I’m a lot more optimistic than you. Everything is sitting there in Atom. Now I have to do it to prove you wrong (grin).

Also, I don’t care what other people expect. I’d have it customized to exactly what I want, which would be damn simple. It would be open-source of course so it could grow at its own pace. Firefox is bloated. It’s time for new blood.

Many years ago before any tabbed browser existed their was a software app that looked and worked exactly like a tabbed browser. It was a win32 app that provided an app window with tabs. In each tab it ran embedded IE. It had a minimal UI above the tabs, I used that as my only browser for at least a year and loved it. I never saw the source but it didn’t seem like it could have been too hard to implement. I see this project as the same thing.


#4

It’s entirely possible! I’ll be interested to see what you come up with :grinning:


#5

It’s going amazingly well. I spent a couple of hours coding and I got browsing with a location bar working. Putting in a URL and linking between pages is all it does now but it was easier than expected. I had trouble getting a lot of security errors at first but putting a magic attribute on the iFrame fixed all that.

Here is what I have so far …

If it isn’t animated then click on it.

If anyone is interested in helping or just trying this let me know and I’ll publish the package and upgrade it every day with the progress.


#6

I think there’s some features that can’t be enabled like local storage. But apart from that there’s nothing really stopping it from working for the majority of pages.

Looks great btw!


#7

Thanks. Apple deserves some of the credit. (grin)

I saw errors in the console about local storage but they went away when I disabled all the security. Is there any chance you can you point me to details of the problem concerning Atom and local storage?

In any case I think most websites have to support lack of local storage, at least for now.


#8

Never mind, after testing it does appear to work correctly with the sandbox flags.


#9

Great! The sandbox flags.were the trick to fixing all the errors I saw.


#10

I’d want to display documentation using functionality like this. Given the word under the cursor, look it up in a syntax-specific way (Python, Perl, JavaScript, …).


#11

If you’re on OS X, there’s Dash and there’s even Dash integration packages for Atom. If you’re not on OS X, there’s Zeal.


#12

I thought we were talking about living inside Atom. @mark_hahn is adding a web browser, after all. So why would I display the docs in some other program?

:smiley:


#13

Good point :grinning:


#14

I have been thinking about how to expose an API so package devs don’t have to hack the browser code. Is there an existing standard API to control a browser? I’m not talking about heavyweight stuff like selenium, just the basics.


#15

I have been asking myself why I want everything in one place. One can argue that you can split your desktop with Atom on left and browser on right. This is what I have been doing for years. But somehow it seems better to not have to do the modal shift. In testing the browser it already feels natural to hop around in the one program. It works well in split panes. I’ll just open Atom in full-screen and live in it. I will lose overlapping windows, which I don’t think I’ll miss. Of course someone could do a package to let Atom editor tabs float. (grin)

I’m going to make things in the browser usage match Atom usage as much as possible. I’m working on an idea to put bookmarks and recently visited pages in a tree on the left just like files. Of course all key bindings will be customizable to match what you expect in atom.

Even if it isn’t more convenient to use in Atom I’ll still use it because it will be tricked out the way I want. This is the main reason I’m using Atom.


#16

Yeah. Window management in your OS is just not the same. I mean those of us who use dwm or awesome or xmonad or somesuch, they will have perfect window management. But me – I read lots of websites, and somehow I always make my browser fullscreen. So I’d have to open a new browser window anyway, and when I do that I’m bound to get documentation tabs in my fullscreen window and news tabs in my documentation window.

Also, on OSX, Command-Tab switches between applications, and it doesn’t behave very well when an application has more than one window. Or maybe there is just something I missed.


#17

personally I like the UNIX idea about “do one thing and do it well”…but it’s interesting

there is a similar project here: http://breach.cc/ if you’re interested, you’re very proactive and proficient so I can imagine than you can do a lot with it…

would be really cool check your html or javascript code inside the own editor, but I’m a bit afraid than given the slow startup of atom and some performance issues, this could be a killer instead of a feature killer


Differences between atom-shell and Breach's thrust?
#18

This looks very interesting. I thought it was pretty much the same architecture as Atom until I saw that each add-on module lives in its own process. You have to do everything through an RPC api. So it is much less hackable than Atom. What’s the fun in following rules? (grin)

I wouldn’t be putting all my eggs in the Atom basket if I didn’t have faith these problems will be resolved. I’ve just started following the issues on atom/atom and exciting progress is being made. All modules across all packages are going to be shared with one load each and the results have been awesome.


#19

I’ve run into my first gotcha. Some sites, including atom.io, cause this …

Refused to display 'https://atom.io/' in a frame because it set 'X-Frame-Options' to 'DENY'.

I have to use an iFrame so this is a problem. The only solution I can think of is to proxy all page loads and strip out that header. This proxy will probably be helpful for other monkeying purposes.

Anyone have any other ideas?

EDIT: atom-shell is awesome. A few months ago they added this optional attribute to the iFrame tag which exactly fixes my problem…

name="google-disable-x-frame-options"

#20

I’ve released a preliminary version here … https://atom.io/packages/web-browser

web-browser package

A web browser that runs seamlessly in the Atom editor

Animated GIF

Warning: This is a preliminary version. Visiting certain pages (see Typical Incompatible Websites below) will cause the Atom window to crash and disappear. If you are browsing arbitrary pages make sure you work is saved.

This is a web browser tightly integrated into the Atom editor. The web pages appear in the normal editor tabs. The pages are fully functional with scripting and linking. A browser toolbar appears at the top of the Atom window to allow simple webpage navigation.

The browser is quite useful for testing a web page inside the same programming editor being used for development. Splitting panes allow code to be seen next to the web page.

The browser has a simple API for other Atom packages to use. @kgrossjo on the Atom discussion board suggested a package that allows clicking on a word in source code and showing the web page documention for the word.

At this time the web-browser is not a replacement for a general-purpose web browser because of a lack of features and serious incompatibility (crashes) with a number of websites (see Typical Incompatible Websites below). It is hoped that both of these problems will be fixed in future versions.

Usage

  • Install with apm install web-browser
  • Press ctrl-alt-B (web-browser:toggle) and a toolbar will appear above the tabs
  • Enter a complete url including the http:// at the beginning and press enter
  • To create a new tab use ctrl-enter instead

API

The API is not documented yet but the code in lib/web-browser.coffee contains all methods needed. The webBrowser object is available as atom.webBrowser globally. To open a page use createPage. For example, to open the apple.com web page use atom.webBrowser.createPage 'http://apple.com'.

Typical Incompatible Websites

I checked about 25 websites from my bookmarks and all worked except the ones below. I’m suspicious that login-forms have some correlation with the big problem shown first.

License

Copyright Mark Hahn by MIT license


EDIT: I built a test app in Atom-Shell and I was able to browse github.com which is in the problem list above. So there is currently some problem in the atom editor environment. This is good news since the page problems above are not fundamental and can probably be fixed.

EDIT 2: Crashing was fixed by https://github.com/atom/atom-shell/issues/656. A new release is eminent.


Debugging Node-JS apps from atom using Node-Inspector in a tab