Remover decoração da janela em tela cheia / modo de borda / aplicativo quiosque do Chrome OS

Question

Jul 10, 2014, 06:10 PM

google-chrome html google-chrome-os google-chrome-app javascript

Remover decoração da janela em tela cheia / modo de borda / aplicativo quiosque do Chrome OS

Eu tenho um aplicativo Web que quero executar no modo quiosque em um chromebox. Até agora, eu praticamente consegui fazer tudo funcionar, mas parece que não consigo me livrar da grande borda branca e irritante da tela. Uma captura de tela do canto superior esquerdo da tela (tela cheia). Eu adicionei uma borda preta para delinear a imagem.

Meu aplicativo da web inicia no azul, a borda branca é adicionada pelo Google Chrome.

A minha aplicaçãomanifest.json:

{
    "manifest_version": 2,
    "name": "snipped",
    "description": "snipped",
    "version": "1.0",
    "icons": {
        "128": "128.png"
    },
    "app": {
        "background": {
            "scripts": [ "background.js" ],
            "persistent": false
        }
    },
    "permissions": [
        "unlimitedStorage",
        "notifications",
        "webview"
    ],
    "kiosk_enabled": true,
    "kiosk_only": true
}

O arquivo que cria a janela do aplicativo (background.js):

chrome.app.runtime.onLaunched.addListener(function() {
    var options = {
        state: 'fullscreen',
        resizable: false,
        alwaysOnTop: true,
        bounds: {
            top: 0,
            left: 0,
            width: 1920,
            height: 1080
        },
        frame: 'none' // Not hiding anything
    };
    chrome.app.window.create('application.html', options);
});

O aplicativo é apenas uma visualização da web (application.html):

<!DOCTYPE html>
<html>
  <head>
    <meta charset='utf-8'>
    <title>Snipped</title>
    <link rel="stylesheet" type="text/css" href="application.css">
  </head>


  <body>
    <webview src="http://snipped.com"></webview>
  </body>
</html>

E a folha de estilo estende a visualização da web para dimensões completas (application.css):

webview {
    height: 100%;
    width: 100%;
}

Mesmo que eu tenha definido oframe para'none', parece não remover a moldura da janela. Como alcançar a verdadeira experiência em tela cheia. Semelhante à aparência quando pressiono F11 no Google Chrome da minha área de trabalho: