How can I make a chrome packaged app which runs in fullscreen at startup?

Question

Currently it seems that the fullscreen ability can only be activated from a user action (mouse/keyboard event). Is there a way to circumvent this?

Answer 1

Check out https://plus.google.com/100132233764003563318/posts/2SuD7MVd8mG referring to recently landed changelist https://chromiumcodereview.appspot.com/12205002. You can lift sample code from either of those sources:

document.body.addEventListener('click', function() {
  document.body.webkitRequestFullscreen();
});

Make sure in your manifest you're requesting the "fullscreen" permission and that you're testing on a sufficiently recent Chrome build (beta channel ought to have this feature by now, and dev definitely does).

Your question specifically refers to packaged apps, but in case anyone reading this answer missed this, this will work only with Chrome packaged apps.

Answer 2

I have got it working with below code

chrome.app.runtime.onLaunched.addListener(function() {
    chrome.app.window.create('index.html', {
    'width': 1024,
    'height': 768
},
function(win) {
    win.maximize();
});
});

Answer 3

Edit: Per BeardFist's comment, my original answer was wrong on two fronts. You can do this on a Chrome Extension (which this is tagged as), but probably not on a packaged app.

For extensions you can make it go fullscreen using the state:"fullscreen" option, which can be applied with chrome.window.update. The code below chains the creation of the window via chrome.windows.create with chrome.window.update. In my experiments you could not set the fullscreen state directly through the window creation.

chrome.windows.create(
  {url:"PATH/TO/POPUP"}, 
    function(newWindow) {
        chrome.windows.update(newWindow.id, {state:"fullscreen"})
});

Answer 4

You can use the HTML5 Fullscreen API, which requires a user action:

button.addEventListener('click', function() {
  document.body.webkitRequestFullscreen();
});

or the more "app-y" way using the AppWindow object, which doesn't require a user action:

chrome.app.window.current().fullscreen();

Both need the "fullscreen" permission in the manifest.json.

Answer 5

main.js

chrome.app.runtime.onLaunched.addListener(function() {
  chrome.app.window.create('index.html',{},function(window) {
    window.fullscreen();
  });
});

manifest.json

{
  ...
  "manifest_version": 2,
  "minimum_chrome_version": "23",
  "app": {
    "background": {
      "scripts": ["main.js"]
    }
  },
  "permissions": ["fullscreen"]
}

Answer 6

Now, you can just add the state:"fullscreen" property on your main .js:

chrome.app.runtime.onLaunched.addListener(
    function() {
        chrome.app.window.create('index.html',
            {
                state: "fullscreen",
            }
        );
    }
);

Make sure you don't add resizable: false or bounds properties, and you add a "fullscreen" permision on the manifest.json.

{
    ...
    "permissions": [
        ...
        "fullscreen"
    ]
}