Skip to content

Commit

Permalink
Introduce inabox-lite (#17180)
Browse files Browse the repository at this point in the history
* Introduce inabox-lite

* Fix check-types

* fix presubmit

*  inabox v1 v2 envelopes
  • Loading branch information
lannka committed Aug 1, 2018
1 parent 7cd0ec4 commit d63debe
Show file tree
Hide file tree
Showing 5 changed files with 178 additions and 10 deletions.
26 changes: 19 additions & 7 deletions build-system/app.js
Original file line number Diff line number Diff line change
Expand Up @@ -333,7 +333,7 @@ function proxyToAmpProxy(req, res, mode) {
'https://cdn.ampproject.org/')
// <base> href pointing to the proxy, so that images, etc. still work.
.replace('<head>', '<head><base href="https://cdn.ampproject.org/">');
const inabox = req.query['inabox'] == '1';
const inabox = req.query['inabox'];
// TODO(ccordry): Remove this when story v01 is depricated.
const storyV1 = req.query['story_v'] === '1';
const urlPrefix = getUrlPrefix(req);
Expand Down Expand Up @@ -686,7 +686,7 @@ app.use('/a4a(|-3p)/', (req, res) => {
// Examples:
// http://localhost:8000/inabox/examples/animations.amp.html
// http://localhost:8000/inabox/proxy/s/www.washingtonpost.com/amphtml/news/post-politics/wp/2016/02/21/bernie-sanders-says-lower-turnout-contributed-to-his-nevada-loss-to-hillary-clinton/
app.use('/inabox/', (req, res) => {
app.use('/inabox/:version/', (req, res) => {
let adUrl = req.url;
const templatePath = '/build-system/server-inabox-template.html';
const urlPrefix = getUrlPrefix(req);
Expand All @@ -696,7 +696,7 @@ app.use('/inabox/', (req, res) => {
// `ads.localhost` to ensure that the iframe is fully x-origin.
adUrl = urlPrefix.replace('localhost', 'ads.localhost') + adUrl;
}
adUrl = addQueryParam(adUrl, 'inabox', 1);
adUrl = addQueryParam(adUrl, 'inabox', req.params['version']);
fs.readFileAsync(pc.cwd() + templatePath, 'utf8').then(template => {
const result = template
.replace(/AD_URL/g, adUrl)
Expand Down Expand Up @@ -738,7 +738,7 @@ app.use(['/dist/v0/amp-*.js'], (req, res, next) => {
app.get(['/examples/*.html', '/test/manual/*.html'], (req, res, next) => {
const filePath = req.path;
const mode = pc.env.SERVE_MODE;
const inabox = req.query['inabox'] == '1';
const inabox = req.query['inabox'];
const stream = Number(req.query['stream']);
fs.readFileAsync(pc.cwd() + filePath, 'utf8').then(file => {
if (req.query['amp_js_v']) {
Expand Down Expand Up @@ -1118,13 +1118,19 @@ function replaceUrls(mode, file, hostName, inabox, storyV1) {
hostName + '/dist/amp-shadow.js');
file = file.replace(
/https:\/\/cdn\.ampproject\.org\/amp4ads-v0\.js/g,
hostName + '/dist/amp-inabox.js');
hostName + '/dist/amp-inabox-lite.js');
file = file.replace(
/https:\/\/cdn\.ampproject\.org\/v0\/(.+?).js/g,
hostName + '/dist/v0/$1.max.js');
if (inabox) {
let filename;
if (inabox == '1') {
filename = '/dist/amp-inabox.js';
} else if (inabox == '2') {
filename = '/dist/amp-inabox-lite.js';
}
file = file.replace(/<html [^>]*>/, '<html amp4ads>');
file = file.replace(/\/dist\/amp\.js/g, '/dist/amp-inabox.js');
file = file.replace(/\/dist\/amp\.js/g, filename);
}
} else if (mode == 'compiled') {
file = file.replace(
Expand All @@ -1143,7 +1149,13 @@ function replaceUrls(mode, file, hostName, inabox, storyV1) {
/\/dist.3p\/current\/(.*)\.max.html/g,
hostName + '/dist.3p/current-min/$1.html');
if (inabox) {
file = file.replace(/\/dist\/v0\.js/g, '/dist/amp4ads-v0.js');
let filename;
if (inabox == '1') {
filename = '/dist/amp4ads-v0.js';
} else if (inabox == '2') {
filename = '/dist/amp4ads-lite-v0.js';
}
file = file.replace(/\/dist\/v0\.js/g, filename);
}
}
return file;
Expand Down
7 changes: 7 additions & 0 deletions build-system/tasks/presubmit-checks.js
Original file line number Diff line number Diff line change
Expand Up @@ -152,6 +152,7 @@ const forbiddenTerms = {
'installActionServiceForDoc': {
message: privateServiceFactory,
whitelist: [
'src/inabox/amp-inabox-lite.js',
'src/service/action-impl.js',
'src/service/standard-actions-impl.js',
'src/runtime.js',
Expand Down Expand Up @@ -198,6 +199,7 @@ const forbiddenTerms = {
'src/amp.js',
'src/amp-shadow.js',
'src/inabox/amp-inabox.js',
'src/inabox/amp-inabox-lite.js',
'src/service/ampdoc-impl.js',
'testing/describes.js',
'testing/iframe.js',
Expand All @@ -209,12 +211,14 @@ const forbiddenTerms = {
'src/amp.js',
'src/amp-shadow.js',
'src/inabox/amp-inabox.js',
'src/inabox/amp-inabox-lite.js',
'src/service/performance-impl.js',
],
},
'installStorageServiceForDoc': {
message: privateServiceFactory,
whitelist: [
'src/inabox/amp-inabox-lite.js',
'src/runtime.js',
'src/service/storage-impl.js',
],
Expand All @@ -229,6 +233,7 @@ const forbiddenTerms = {
'installUrlReplacementsServiceForDoc': {
message: privateServiceFactory,
whitelist: [
'src/inabox/amp-inabox-lite.js',
'src/runtime.js',
'src/service/url-replacements-impl.js',
],
Expand All @@ -238,6 +243,7 @@ const forbiddenTerms = {
whitelist: [
'src/runtime.js',
'src/inabox/amp-inabox.js',
'src/inabox/amp-inabox-lite.js',
'src/service/viewer-impl.js',
],
},
Expand Down Expand Up @@ -267,6 +273,7 @@ const forbiddenTerms = {
'installResourcesServiceForDoc': {
message: privateServiceFactory,
whitelist: [
'src/inabox/amp-inabox-lite.js',
'src/runtime.js',
'src/service/resources-impl.js',
'src/service/standard-actions-impl.js',
Expand Down
5 changes: 2 additions & 3 deletions examples/inabox.amp.html
Original file line number Diff line number Diff line change
Expand Up @@ -2,12 +2,11 @@
<html ⚡4ads>
<head>
<meta charset="utf-8">
<link rel="canonical" href="http://nonblocking.io/" >
<meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
<style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
<style amp4ads-boilerplate>body{visibility:hidden}</style>
<script async src="https://cdn.ampproject.org/amp4ads-v0.js"></script>
<script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
<style>
<style amp-custom>
.left {
text-align: left;
}
Expand Down
15 changes: 15 additions & 0 deletions gulpfile.js
Original file line number Diff line number Diff line change
Expand Up @@ -430,6 +430,21 @@ function compile(watch, shouldMinify, opt_preventRemoveAndMakeDir,
);
}

if (argv.with_inabox_lite) {
promises.push(
// Entry point for inabox runtime.
compileJs('./src/inabox/', 'amp-inabox-lite.js', './dist', {
toName: 'amp-inabox-lite.js',
minifiedName: 'amp4ads-lite-v0.js',
includePolyfills: true,
extraGlobs: ['src/inabox/*.js', '3p/iframe-messaging-client.js'],
checkTypes: opt_checkTypes,
watch,
preventRemoveAndMakeDir: opt_preventRemoveAndMakeDir,
minify: shouldMinify,
}));
}

promises.push(
thirdPartyBootstrap(
'3p/frame.max.html', 'frame.html', shouldMinify),
Expand Down
135 changes: 135 additions & 0 deletions src/inabox/amp-inabox-lite.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,135 @@
/**
* Copyright 2018 The AMP HTML Authors. All Rights Reserved.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS-IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/

/**
* The entry point for AMP inabox lite runtime (amp4ads-lite-v0.js).
*/

import '../polyfills';
import {Navigation} from '../service/navigation';
import {Services} from '../services';
import {
adopt,
installBuiltins,
installRuntimeServices,
} from '../runtime';
import {cssText} from '../../build/css';
import {fontStylesheetTimeout} from '../font-stylesheet-timeout';
import {getMode} from '../mode';
import {installDocService} from '../service/ampdoc-impl';
import {installErrorReporting} from '../error';
import {installIframeMessagingClient} from './inabox-iframe-messaging-client';
import {installInaboxViewportService} from './inabox-viewport';
import {installPerformanceService} from '../service/performance-impl';
import {installStylesForDoc, makeBodyVisible} from '../style-installer';
import {installViewerServiceForDoc} from '../service/viewer-impl';
import {registerIniLoadListener} from './utils';
import {stubElementsForDoc} from '../service/custom-element-registry';

import {installActionServiceForDoc} from '../service/action-impl';
import {installCidService} from '../service/cid-impl';
import {installDocumentInfoServiceForDoc} from '../service/document-info-impl';
import {installGlobalNavigationHandlerForDoc} from '../service/navigation';
import {installGlobalSubmitListenerForDoc} from '../document-submit';
import {installHistoryServiceForDoc} from '../service/history-impl';
import {installResourcesServiceForDoc} from '../service/resources-impl';
import {installStandardActionsForDoc} from '../service/standard-actions-impl';
import {installStorageServiceForDoc} from '../service/storage-impl';
import {installUrlForDoc} from '../service/url-impl';
import {installUrlReplacementsServiceForDoc} from '../service/url-replacements-impl';

getMode(self).runtime = 'inabox';

/** @type {!../service/ampdoc-impl.AmpDocService} */
let ampdocService;
// We must under all circumstances call makeBodyVisible.
// It is much better to have AMP tags not rendered than having
// a completely blank page.
try {
// Should happen first.
installErrorReporting(self); // Also calls makeBodyVisible on errors.

// Declare that this runtime will support a single root doc. Should happen
// as early as possible.
installDocService(self, /* isSingleDoc */ true); // TODO: to be simplified
ampdocService = Services.ampdocServiceFor(self);
} catch (e) {
// In case of an error call this.
makeBodyVisible(self.document); // TODO: to be simplified
throw e;
}

/** @const {!../service/ampdoc-impl.AmpDoc} */
const ampdoc = ampdocService.getAmpDoc(self.document);
installPerformanceService(self); // TODO: to be removed

self.document.documentElement.classList.add('i-amphtml-inabox');
const fullCss = cssText
+ 'html.i-amphtml-inabox{width:100%!important;height:100%!important}'
+ 'html.i-amphtml-inabox>body{position:initial!important}';
installStylesForDoc(ampdoc, fullCss, () => {
// Core services.
installRuntimeServices(self);
fontStylesheetTimeout(self);
installIframeMessagingClient(self); // TODO: to be removed
installAmpdocServices(ampdoc);
// We need the core services (viewer/resources) to start instrumenting
registerIniLoadListener(ampdoc);

// Builtins.
installBuiltins(self);
adopt(self);

// Pre-stub already known elements.
stubElementsForDoc(ampdoc);

Navigation.installAnchorClickInterceptor(ampdoc, self);
makeBodyVisible(self.document, /* waitForServices */ true); // TODO: to be simplified

Services.resourcesForDoc(ampdoc).ampInitComplete();
}, /* opt_isRuntimeCss */ true, /* opt_ext */ 'amp-runtime');

// Output a message to the console and add an attribute to the <html>
// tag to give some information that can be used in error reports.
// (At least by sophisticated users).
if (self.console) {
(console.info || console.log).call(console,
'Powered by AMP ⚡ HTML – Version $internalRuntimeVersion$',
self.location.href);
}
self.document.documentElement.setAttribute('amp-version',
'$internalRuntimeVersion$');

/**
* Install ampdoc-level services.
* @param {!../service/ampdoc-impl.AmpDoc} ampdoc
* @param {!Object<string, string>=} opt_initParams
*/
function installAmpdocServices(ampdoc, opt_initParams) {
installUrlForDoc(ampdoc);
installCidService(ampdoc); // TODO: to be simplified
installDocumentInfoServiceForDoc(ampdoc);
installViewerServiceForDoc(ampdoc, opt_initParams); // TODO: to be simplified
installInaboxViewportService(ampdoc); // TODO: to be simplified
installHistoryServiceForDoc(ampdoc);
installResourcesServiceForDoc(ampdoc); // TODO: to be simplified
installUrlReplacementsServiceForDoc(ampdoc);
installActionServiceForDoc(ampdoc);
installStandardActionsForDoc(ampdoc);
installStorageServiceForDoc(ampdoc); // TODO: to be simplified
installGlobalNavigationHandlerForDoc(ampdoc);
installGlobalSubmitListenerForDoc(ampdoc);
}

0 comments on commit d63debe

Please sign in to comment.