I am working on project which will run as Chrome App & regular site.

How can I test/check in my JS if I am in an Chrome App? (i.e. some functionality will only work under chrome)

Just FYI, here is my Chrome App manifest, please note I am running this in the developer mode (directly from the source, not packaged yet)

{
    "manifest_version": 2,
    "name": "Example KIOSK APP",
    "version": "1.1",
    "icons": {
        "16": "images/icon-16.png",
        "48": "images/icon-48.png",
        "128": "images/icon-128.png"
    },
    "app": {
        "background": {
            "scripts": ["background.js"],
            "persistent": true
        }
    },
    "kiosk_enabled": true,
    "offline_enabled": true,
    "permissions": [
        "system.display",
        "power",
        "webview",
        "fileSystem",
        "alwaysOnTopWindows",
        "system.storage",
         "<all_urls>"
    ]
}

Any suggestions much appreciated.

I am working on project which will run as Chrome App & regular site.

How can I test/check in my JS if I am in an Chrome App? (i.e. some functionality will only work under chrome)

Just FYI, here is my Chrome App manifest, please note I am running this in the developer mode (directly from the source, not packaged yet)

{
    "manifest_version": 2,
    "name": "Example KIOSK APP",
    "version": "1.1",
    "icons": {
        "16": "images/icon-16.png",
        "48": "images/icon-48.png",
        "128": "images/icon-128.png"
    },
    "app": {
        "background": {
            "scripts": ["background.js"],
            "persistent": true
        }
    },
    "kiosk_enabled": true,
    "offline_enabled": true,
    "permissions": [
        "system.display",
        "power",
        "webview",
        "fileSystem",
        "alwaysOnTopWindows",
        "system.storage",
         "<all_urls>"
    ]
}

Any suggestions much appreciated.

• javascript
• google-chrome
• google-chrome-app

• Okay then, this is quite a bit of conceptual mess then. This is not a hosted app, but what is now called just a "Chrome App". But a Chrome App conceptually bundles all of its resources inside itself; how are you going to run the same code as the website? A <webview>? – Xan Commented Sep 30, 2014 at 10:33
• @Xan - app is written in AngularJS. For example, I will display extranal site with ng-switch-when and use webview for Chrome App and normal iFrames otherwise. Hence I need a check to make sure I am under app or just a browser. – Iladarsda Commented Sep 30, 2014 at 10:35
• To reformulate: if your app code runs at all (background.js, windows you create), you're in an app. And you want to pass information "I'm from a Chrome App" to the page inside a <webview>. Correct? If yes, please edit the question to clarify it. – Xan Commented Sep 30, 2014 at 10:36
• @Xan I was planning to use similar functionality to Modernizer, just add a class on the body which will state where I am (e.g. add a class chromeApp, or just chrome, or even no-chrome – Iladarsda Commented Sep 30, 2014 at 10:38
• Can I access the DOM from the background.js? Or is it considered bad practice? – Iladarsda Commented Sep 30, 2014 at 10:38

3 Answers 3

Turns out the question meant to distinguish between identical code running in a webpage and inside a (regular) Chrome App window.

It is enough to test for Chrome App APIs that are never exposed to regular pages. An example of that would be to test for app.runtime:

if (window.chrome && chrome.app && chrome.app.runtime) {
  // Running inside a Chrome App context
} else {
  // Either not Chrome, or not as an app window
}

Edit: This answer turned out not to be relevant to this particular question, but I think I will leave this in case someone stumbles upon this question with a hosted app.

I assume that by "run as Chrome App" you mean a hosted Chrome App.

In this case, it is enough to check chrome.app.isInstalled from the website's code. It's not easy to find this in the documentation, as it was apparently left out as some point, but I will put this as a reference. I just checked and it still works.

So:

// Website code
if (window.chrome && chrome.app && chrome.app.isInstalled) {
  // App is installed
} else if (chrome) {
  // In Chrome, but app is not installed: offer inline install?
} else {
  // Not in Chrome at all
}

I am searching for a way to know, if Chrome was started with --app=https://example. (so in single page mode) or as full browser (with tabs, menu, etc.). The answers above don't seem to apply in this case, as it is not an "installed" app. (Chrome app supported was discontinued, right?)

Is there a way to detect, if the page is was opened with --app?