We Keep Coding

Remote loading iframe in chrome extension can't access chrome properties

I am building a chrome extension which uses a back end (php) app with gmail API and because
i do not want to separate Google apps / i need to have the chrome extension consume a
backed API as i cannot whitelist a chrome extension for gmail API / use the existing web app.
To solve this i have put the extension app on a subdomain whitelisted for gmail API and i am loading this domain via an iframe into the chrome extension.
The issue is that the subdomain cannot access the chrome properties inside the iframe:
chrome.tabs.query or chrome.runtime.onMessage
to enable talk to the content script.
i get the error
chrome is not defined
What is the best solution for this?

How to remove "No Network" alert in my PWA on iOS

When my iOS device is not connected to a network, the alert below pops up in my Progressive Web App when opened. How can I remove this to give my PWA a more native feel?

You may check the web app manifest component found in this documentation.
When connecting to a network for the first time, a web browser reads the manifest file, downloads the resources given and stores them locally. Then, if there is no network connection, the browser uses the local cache to render the web app while offline.
Note: Do not confuse this with the older .manifest file used by AppCache. PWAs should use the service worker to implement caching and the web app manifest to enable "add to homescreen" and push messaging.
Here are some additional links for reference:
Service Worker: handle requests when offline to send them when online
Offline web application using beforeunload event
Progressive Web App: offline cache does not work on Android, it works on Chrome dev Tools

Kiosk chrome app: navigate to URL

I have built a Chrome App which needs to load some websites inside its own window.
The purpose is to display full-screen contents on TVs using Google Chromeboxes in Kiosk mode.
I can't use iframes as the content I must load doesn't allow it.
My researches led me to some code like :
chrome.browserAction.onClicked.addListener(function(tab) {
chrome.tabs.create({'url': event.target.href})
})
This seems to open a new tab on the browser running the extension, but not in the extension window.
The vision I have about chrome apps may be confused as it's the first I'm developing, please don't hesitate to tell me the basics I would not have heard of

You need to use the <webview> tag, available in Chrome Apps, to embed external content.
This does not trigger anti-framing protection, since from the point of view of web security each <webview> is a top-level browsing context.
Note the limitations of <webview>: some web features like message boxes or permission requests have to be implemented by you.
As an example of webview usage, see the Browser sample app.

Can I make a socket connection through Javascript

What I want to do
Make a simple socket connection to a server on the browser. I want to not send any header information with the socket connection.
The Problem
It looks like I am unable to make a socket connection with javascript that does not send header data (Is there a way to do a tcp connection to an IP with javascript?).
I thought maybe I could make a connection with a chrome extension, however it looks like the socket API is only available for chrome apps (Google Chrome Socket API in extensions).
I am thinking that I might need to make a native application that will make socket connections through requests made by the browser using Native Messaging.
Is there anyway I can achieve this or am I out of luck?

Raw socket connections through the browser are wrapped up in security concerns. Users can be easily manipulated to allow things to run that shouldn't.
TCP and UDP Socket API
W3C Editor's Draft 20 January 2016
is located here.
http://raw-sockets.sysapps.org/
Mozilla's API information here: https://developer.mozilla.org/en-US/docs/Archive/B2G_OS/API/TCPSocket "This API is available on Firefox OS for privileged or certified applications only."
If you work with raw TCP connections. I would suggest
(1) downloading PHP onto the local computer. PHP has a developer web host build in so you can run whatever application you want on PHP using the browser as your GUI.
(2) download node.js.

You are not out of luck you just need to achieve it with the understanding that you are working outside the box for normal browser based scripting created from security concerns, and that means the user/client needs to install something manually.
If you must use chrome browser on the client side, you will need to make an -extension- correction webapp. You can as a developer make one that you can use on your own computers.
https://developer.chrome.com/extensions/getstarted
https://developer.chrome.com/apps/first_app
Load the extension#
Extensions that you download from the Chrome Web
Store are packaged up as .crx files, which is great for distribution,
but not so great for development. Recognizing this, Chrome gives you a
quick way of loading up your working directory for testing. Let's do
that now.
Visit chrome://extensions in your browser (or open up the Chrome menu
by clicking the icon to the far right of the Omnibox: The menu's icon
is three horizontal bars. and select Extensions under the Tools menu
to get to the same place).
Ensure that the Developer mode checkbox in the top right-hand corner
is checked.
Click Load unpacked extension… to pop up a file-selection dialog.
Navigate to the directory in which your extension files live, and
select it.
Alternatively, you can drag and drop the directory where your
extension files live onto chrome://extensions in your browser to load
it.
If the extension is valid, it'll be loaded up and active right away!
If it's invalid, an error message will be displayed at the top of the
page. Correct the error, and try again.
This insures that non developers don't load an extension which does not comply with the normal security concerns.
Communicating between with the script on the web page to the extension.
Can be done with message passing ... https://developer.chrome.com/extensions/messaging
The extension can add content directly to the web page which is available to the script on the web page. If for example the extension replaced the web cam image with a static image when the webcam script reads what it believes is the webcam it gets the static image instead, which explains why I look like an alien from space on the webcam. Although I did not create an extension to do that, I merely modified an existing extension to replace the function that gets the webcam image with a function to get a static image.

You can use SignalR, it is javascript library (JQuery Plugin) and it enables you to open web sockets from the browser to a server. Please check the following links:
https://blog.3d-logic.com/2015/03/29/signalr-on-the-wire-an-informal-description-of-the-signalr-protocol/
http://blog.teamtreehouse.com/an-introduction-to-websockets
https://github.com/SignalR/SignalR

Chrome Tab Sync javascript API

Is there a javascript API for Chrome Tab Sync for web sites? I'm not asking about Chrome Extensions, just web sites.
For example, I'd like to store some text (a string) when you open a web site on the desktop then when you open that same page in the chrome mobile browser I'd like to display that stored text.
Is this possible? I know with Chrome Extensions there is chrome.storage, but I don't believe that is available for websites.

You should store that information:
on your server,
in the URL of the page (?mystring=...),
or on your server with a lookup key for the specific info in the URL.
Any one of these is an ordinary thing to do and will work for all browsers and all ways to get a page from one device to another, without relying on any features specific to Chrome.