Overriding the right-click context menu in web browsers - pros and cons - browser

We are programming a web application (not 'just' a web site, but functionality-wise a real application), and have the following discussion for the next release:
our UI designer wants to replace the browser's right-click context menu (showing our own menu where appropriate, or no menu at all) because he wants the web app to be more like our (existing) Windows app
our developers (and I) strongly object because this is bad practice, and simply something you do not do in a web application
Thus, I'm looking for "more solid" arguments - like best practice guidelines, any statements from reputable sources, coding arguments etc. - for the pros and cons of this issue, which I can hopefully use to resolve it once and for all...

You can't do that reliably anyway. In Firefox, go to Settings, Contents, JavaScript/Advanced (I'm guessing the captions, no English Firefox (; ) to override context menu behaviour and bang, your app doesn't work anymore. My online-banking application did this in their old version, so I couldn't do copy & paste with the mouse. I hated it, so I enabled the protection in Firefox and it worked. Kind of. Their new version doesn't do such bad things anymore.
Instead, use a little drop-down arrow where a context menu is needed, that can either be clicked or just hovered over to show the menu. JetBrains' TeamCity web app does that very well.

If your application is to run in an intranet, maybe the UI designer arguments are valid: as long as all of the users of the application are well known and you want to emulate some Windows application, I think it's ok to restrict the right-click or any other input, because it's just the requirements of this application, as it would be to any other app.
But if your application is to run in the internet, disabling or replacing right-click is a very bad idea, and these are only some of the arguments I reminded of:
First of all, changing the behavior of the user interface is aggressive and annoying -- no one wants to get used to "new controls" just to access your site, and generally people hate to leave their comfort area. I mean, I know what my right click does and I want it to do always the same thing.
People can understand the difference between Windows apps and web apps, so there's no need to "emulate Windows app behavior".
Not everyone uses Windows :-)
Also, this is innefective, sice there are several ways to overwrite this behavior, such as settings in Firefox or even plugins that disable specific javascript instructions, such as this one.

depending on your audience you stand a very good chance your users do not even KNOW there's a right click menu. So please don't make this the only alternative

I personally believe you should leave browser's default behaviors alone... users are used to them, so no need to get them used to your way of doing things.
However, if you're building an intranet (instead of a public site), then I'm for tweaking as much as possible to improve usability.

An argument I would use (in quotes for dramatic effect):
Lack of consistency & reduced
functionality compared to other
unhindered web interfaces will lead to
a loss of user confidence - which
is undesirable to say the least.
Of course, if many or most of the web application users are already familiar with or regular users of the Windows app, the UI designer could be on the right track and the consistency with the Windows app could be a winner.
That said, in my opinion it's hard to make a custom context-menu within a web page intuitive, and while some users might warm to it, I'm guessing most will probably never use it.

because he wants the web app to be more like our (existing) Windows app
I think right-click in a Windows app is a bad idea.
In a web browser it's a UI disaster because nobody will be expecting it.

I think it depends on whether you perceive the context-menu as part of the browsers chrome or not. If you do (and I ascribe to this view), then it should be off target, but otherwise it is a good place for adding some usability to your application.

Replacing the browser right-click context menu for specific areas of your GUI from your web application can be quite useful. Doing this just to disable the context menu will annoy your users, who may try to find a way around it. Also, removing or replacing the browser right-click context menu from the entire area of your application will usually be annoying and can make it more difficult to debug.
Unfortunately, I cannot offer any more solid arguments, and I'm not exactly taking either side of the argument, but I thought I would share my experience both as a developer of a web application and as a web user.

Related

Security Implications in Electron as a Web Browser

I asked this question a little over a week ago on the Atom forums (link below), and didn't receive a response, so I am reposting it here in the hopes that someone may be able to provide insight on my problem.
Recently, I have taken up an open source project which uses Electron as it’s front-end. This project has two requirements: it must be cross-platform, and it must have an embedded web browser (which should be able to browse the web and render content like a typical browser). Considering the rather large footprint Electron has already netted my application, it seems like a bad idea to attempt to use another embedded web framework alongside it. So, in the interest of simplifying my project and retaining the UI built on top of Electron, I am looking into using Electron itself as the web browser. Here’s where I’ve come into a problem.
In a security page for Electron’s documentation, it is explicitly stated that,
it is important to understand … Electron is not a web browser
This quote comes within the context that Electron–or rather the code running on top of it–carries the unique ability to interact with the user’s operating system, unlike typical web applications. The page goes on to say,
displaying arbitrary content from untrusted sources poses a severe security risk that Electron is not intended to handle
At this point, I was tempted to give up on the idea of using Electron as an inbuilt browser, but further down on that same page, you can find another very interesting tidbit:
To display remote content, use the <webview> tag or BrowserView , [and] make sure to disable the nodeIntegration and enable contextIsolation
Link: https://electronjs.org/docs/tutorial/security#isolation-for-untrusted-content
First, in regard to using webviews, Electron’s own documentation recommends outright avoiding them:
Electron’s webview tag is based on Chromium’s webview , which is undergoing dramatic architectural changes. This impacts the stability of webviews , including rendering, navigation, and event routing. We currently recommend to not use the webview tag and to consider alternatives, like iframe , Electron’s BrowserView , or an architecture that avoids embedded content altogether.
Link: https://electronjs.org/docs/api/webview-tag
Seeing as though I cannot avoid embedded content, I opted to look into using a BrowserView, but what I found was not very motivating either. The advice, as it stands, is to do two things:
disable nodeIntegration
enable contextIsolation
After looking at the security and best-practices page, I will also append the following steps:
deny session permission requests from remote content (webcam, microphone, location, etc.)
catch webview elements in creation and strip default privileges
disable the creation of new windows
disable the remote module
That is a fair amount of steps to undergo in securing external content. Not to mention, there were several additional warnings scattered through the best practices page such as the following:
(On verifying webview options before creation)
Again, this list merely minimizes the risk, it does not remove it. If your goal is to display a website, a browser will be a more secure option.
Link: https://electronjs.org/docs/tutorial/security#11-verify-webview-options-before-creation
(On disabling the remote module)
However, if your app can run untrusted content and even if you sandbox your renderer processes accordingly, the remote module makes it easy for malicious code to escape the sandbox and have access to system resources via the higher privileges of the main process.
Link: https://electronjs.org/docs/tutorial/security#15-disable-the-remote-module
Not to mention, upon navigation to the BrowserView page, the whole class is listed as experimental.
This all isn’t even to mention the added attack surface created by Electron, such as a vulnerability in the webview component just last year: CVE-2018-1000136
Now, taking into account all of the above, numerous developers have still opted to create web browsers that routinely consume external and uncontrolled content using Electron.
Browser’s using Electron (linked directly from Electron’s website):
https://electronjs.org/apps/wexond
https://electronjs.org/apps/dot
https://electronjs.org/apps/beaker-browser
To me, it seems irresponsible to submit users to the above security implications as a trade-off for convenience.
That being said, my question is: can you safely, to the point at which you could ensure the integrity of your users, implement web browsing capabilities for uncontrolled content using Electron?
Thank you for your time.
Link to the original post:
https://discuss.atom.io/t/security-implications-in-electron-as-a-web-browser/70653
Some ideas that don't fit into a comment box:
[the project] must have an embedded web browser
So I presume then that this project isn't just a web browser. There's other content there that may have access to Node, but you just want the embedded-web-browser portion of it to be sandboxed appropriately, right?
Regarding the comments about <webview>, yes, it is considered unstable and Electron recommends using a BrowserView instead. I don't think that the fact that it's marked as "experimental" should necessarily deter you from using it (especially considering that the Electron team is recommending it [though maybe as the best of two evils]).
Experimental doesn't imply it's unstable. It can just mean that the Electron team is experimenting with this approach, but this approach may change in the future (at which point I would expect Electron to provide a transition path forward). Though this is one possible interpretation and ultimately Electron would have to comment on this.
The advice... is to do two things:
disable nodeIntegration
enable contextIsolation
I would also make use of the sandbox option inherited from BrowserWindows. BrowserView's docs on the constructor options say:
webPreferences Object (optional) - See BrowserWindow.
which tells me that BrowserView accepts the same options as BrowserWindow.
You would set it up like so:
new BrowserView({ webPreferences: {
sandbox: true,
nodeIntegration: false,
contextIsolation: true,
preload: "./pathToPreloadScript.js"
}});
See more information about this approach here. The preload script is what would expose some Node IPC APIs to the sandboxed content you're loading. Note the Status section at the bottom, which says:
Please use the sandbox option with care, as it is still an experimental feature. We are still not aware of the security implications of exposing some Electron renderer APIs to the preload script
If the content you're loading in the BrowserView never needs to communicate back to the application, then you don't need a preload script at all and can just sandbox the BrowserView.
After looking at the security and best-practices page, I will also append the following steps:
deny session permission requests from remote content (webcam, microphone, location, etc.)
catch webview elements in creation and strip default privileges
disable the creation of new windows
disable the remote module
Sure, those sound reasonable. Note that if your embedded browser needs to be able to open new windows (via window.open or <a target="_blank" />) then you'd have to allow popups.
That is a fair amount of steps to undergo in securing external content.
Sure, but is your main concern with the security of the app, or with how much work it takes to make it secure? Browser developers need to consider similar things to ensure webpages can't get access to the OS. It's just part of the game.
Again, this list merely minimizes the risk, it does not remove it. If your goal is to display a website, a browser will be a more secure option.
This is just saying that if all you're trying to do is display a website, then just use a browser since that's what they're there for.
If you need to do other things, well then you can't use a browser, so you'll have to make your own app, making sure it's reasonably secure.
I think that if you follow what's recommended in the Security document and keep up to date with new Electron releases, then you're doing the best you can do.
As for whether that's good enough, I can't say. It depends on what you're developing and what you're trying to protect against.
However, my thoughts can't substitute the more expert opinions of those on the Electron team. This question could certainly use some guidance from them.

Why I cannot use two or more "browser_action", "page_action" or "app" together?

Is there any good reason why I can't use two of them together?
browser_action
page_action
app
I can't think why single extension can't use browser and page specific actions together. Why should I have to write single extension for each action ...
For a browser that boasts about its simplicity I believe that is the clearest explanation. To prevent clutter.
Packaged Apps is the easiest to explain as they are basically an alternative to Hosted Apps for developers that don't wish to host a service or wish to make their app fully integrated in to Chrome and/or work offline. However, since packaged apps are bundled as extensions this prevents them from adding anything to the browser's chrome since hosted apps don't have this ability.
Regarding the action choice, I can only imagine this restriction is to help prevent extensions from overcrowding the address bar and the toolbar with duplication.
In a lot of cases using badges and the onClicked event correctly can replicate a lot of the functionality of page actions in browser actions while using a combination of content scripts and message passing to trigger changes.
The StumbleUpon extension rotates its browser action's behavior depending on whether or not its toolbar is currently displaying.

Pinned Sites in browsers other than IE 9/Win 7

Is there an equivalent to IE 9's pinned sites feature for other browsers/operating systems?
EDIT:
Pinned sites are basically mini-applications that live on the Windows Task bar. (They remind me of web-based apps in iPhone.) Once "installed" you get jump lists with different activities you can do in the site. It also supports icon overlays so you can post notifications right on the task bar.
I find it to be a really interesting idea, but I wonder if it will catch on if none of the other browsers are willing to support it.
http://windows.microsoft.com/en-US/internet-explorer/products/ie-9/features/pinned-sites
http://www.beautyoftheweb.com/#/highlights/seamless-with-windows-7
From what I can see, only IE9 can do that deep kind of site pinning for Windows. For Mac, there are a few things I've heard of to put a website/webapp in the doc and receive notifications I think. One tool is called Fluid:
http://fluidapp.com/
But I don't know if that has anything like the Dynamic Jump Lists in Pinned Site buttons.

What aspects of a Web Browser should be configurable via plugins?

I'm looking at this from the perspective of the plugin developer not the user of the browser, so I'm interested in what developers think is the ideal interface for plugins to a browser. For example: Plugins can reorder, create and destroy Tabs, Plugins can draw behind and in front of Browser pages etc.
I'm particularly concerned about the security aspects
A web browser should have a firebug plug inn which help the developers.Concerned about security browser should block Phishing.
The major thing that I look for right away is how easy it is to open a preference pane, new windows, and the security preference variables.
I also like the ability to iterate through tabs, searching through various aspects such as page currently displayed within each of those tabs.

Good reasons for not letting the browser launch local applications

I know this might be a no-brainer, but please read on.
I also know it's generally not considered a good idea, maybe the worst, to let a browser run and interact with local apps, even in an intranet context.
We use Citrix for home-office, and people really like it. Now, they would like the same kind of environment at work, a nice page where every important application/document/folder is nicely arranged and classified in an orderly fashion. These folks are not particularly tech savvy; I don't even consider thinking that they could understand the difference between remote delivered applications and local ones.
So, I've been asked if it's possible. Of course, it is, with IE's good ol' ActiveX controls. And I even made a working prototype (that's where it hurts).
But now, I doubt. Isn't it madness to allow such 'dangerous' ActiveX controls, even in the 'local intranet' zone? People will use the same browser to surf the web, can I fully trust IE? Isn't there a risk that Microsoft would just disable those controls in future updates/versions? What if a website, or any kind of malware, just put another site on the trust list? With that extent of control, you could as well uninstall every protection and just run amok 'till you got hanged by the IT dept.
I'm about to confront my superiors with the fact that, even if they saw it is doable, it would be a very bad thing. So I'm desperately in need of good and strong arguments, because "let's don't" won't do it.
Of course, if there is nothing to be scared of, that'll be nice too. But I strongly doubt that.
We use Citrix for home-office, and people really like it. Now, they would like the same kind of environment at work, a nice page where every important application/document/folder is nicely arranged and classified in an orderly fashion
I haven't used Citrix very many times, but what's it got to do with executing local applications? I don't see how "People like Citrix" and "browser executing local applications" relate at all?
If the people are accessing your Citrix server from home, and want the same experience in the office, then buy a cheap PC, and run the exact same Citrix software they run on their home computers. Put this computer in the corner and tell them to go use it. They'll be overjoyed.
Isn't it madness to allow such 'dangerous' ActiveX controls, even in the 'local intranet' zone ? People will use the same browser to surf the web, can I fully trust IE ?
Put it this way. IE has built-in support for AX controls. It uses it's security mechanisms to prevent them from running unless in a trusted site. By default, no sites are trusted at all.
If you use IE at all then you're putting yourself at the mercy of these security mechanisms. Whether or not you tell it to trust the local intranet is beside the point, and isn't going to affect the operation of any other zones.
The good old security holes that require you to reboot your computer every few weeks when MS issues a patch will continue to exist and cause problems, regardless of whether you allow ActiveX in your local intranet.
Isn't there a risk that Microsoft would just disable those controls in future updates / versions ?
Since XP-SP2, Microsoft has been making it increasingly difficult to use ActiveX controls. I don't know how many scary looking warning messages and "This might destroy your computer" dialogs you have to click through these days to get them to run, but it's quite a few. This will only get worse over time.
Microsoft is walking a fine line. On one hand, they regularly send ActiveX killbits with Windows Update to remove/disable applications that have been misbehaving. On the other hand, the latest version of Sharepoint 2007 (can't speak for earlier versions) allows for Office documents to be opened by clicking a link in the browser, and edited in the local application. When the edit is finished, the changes are transmitted back to the server and the webpage (generally) is refreshed. This is only an IE thing, as Firefox will throw up an error message.
I can see the logic behind it, though. Until Microsoft gets all of their apps 'in the cloud', there are cases that need to bridge the gap between the old client-side apps and a more web-centric business environment. While there is likely a non-web workaround, more and more information workers have come to expect that a large portion of their work will be done in a browser. Anything that makes the integration with the desktop easier is not going to be opposed by anyone except the sysadmins.
The standard citrix homepage (or how we use it) is a simple web page with program icons. Click on it, and the application get's delivered to you. People want the same thing, at work, with their applications/folders/documents. And because I'm a web developer, and they asked me, I do it with a web page... Perhaps I should pass the whole thing over to the VB guy..
Ahh... I know of 2 ways to accomplish this:
You can embed internet explorer into an application, and hook into it and intercept certain kinds of URL's and so on
I saw this done a few years ago - a telephony application embedded internet explorer in itself, and loaded some specially formatted webpages.
In the webpage there was this:
Call John Smith
Normally this would be a broken URL, but when the user clicked on this link, the application containing the embedded IE got notified, and proceeded to execute it's own custom code to dial the number from the URL.
You could get your VB guy to write an application which basically just wraps IE, and has handlers for executing applications. You could then code normal webpages with links to just open applications, and the VB app would launch them. This allows you to write your own security stuff (like, only launch applications in a preset list, or so on) into the VB app, and because VB is launching them, not IE, none of the IE security issues will be involved.
The second way is with browser plug-ins.
For example, skype comes with a Firefox plug-in, which looks for phone-numbers in web-pages, and attaches special links to them. When you click on these links it invokes skype - you could conceivably do something similar for launching your citrix apps.
You'd then be tied to firefox though. Writing plugins for IE is much harder than for FF, I wouldn't go down that path unless forced to.

Resources