invisi/angular.js
1
0
Fork 0
Code Issues Pull Requests Actions Packages Releases Wiki Activity

chore(docs-app): remove document.write() from docs index.html

Browse Source 
Previously, the docs app used `document.write()`, causing the following
warning on Chrome:

```
A parser-blocking, cross site (i.e. different eTLD+1) script,
https://ajax.googleapis.com/ajax/libs/angularjs/1.7.9/angular.min.js, is
invoked via document.write. The network request for this script MAY be
blocked by the browser in this or a future page load due to poor network
connectivity.
```

In the past, `document.write()` seems to have been used in order for
browsers (such as Firefox) to work correctly with our dynamically set
`<base>` tag and relative style/script URLs.

This commit replaces `document.write()` with regular
`<style>`/`<script>` tabs to avoid the warning (and potential issues due
to poor network connectivity). It seems that the latest versions of
Chrome, Firefox and IE can handle this fine (without naticeable delays).

Fixes #15396
This commit is contained in:
George Kalpakas
2020-05-24 22:43:48 +03:00
committed by Pete Bacon Darwin
parent 2518966153
commit a31c207bf1
1 changed files with 24 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/config/templates/app/indexPage.template.html
+24 -38
View File
@@ -1,3 +1,12 @@
{# Macros #}
{%- macro addTag(name, attributes) %}
<{$ name $}
{%- for attrName, attrValue in attributes -%}
{$ ' ' + attrName $}="{$ attrValue $}"
{%- endfor -%}
></{$ name $}>
{%- endmacro -%}
<!doctype html>
<html lang="en" ng-app="docsApp" ng-strict-di ng-controller="DocsController">
<head>
@@ -24,50 +33,27 @@
})();
</script>
<script type="text/javascript">
// dynamically add base tag as well as css and javascript files.
// we can't add css/js the usual way, because some browsers (FF) eagerly prefetch resources
// before the base attribute is added, causing 404 and terribly slow loading of the docs app.
// Dynamically add `<base>` tag.
(function() {
var indexFile = (location.pathname.match(/\/(index[^\.]*\.html)/) || ['', ''])[1],
rUrl = /(#!\/|api|guide|misc|tutorial|error|index[^\.]*\.html).*$/,
var indexFile = (location.pathname.match(/\/(index[^.]*\.html)/) || ['', ''])[1],
rUrl = /(#!\/|api|guide|misc|tutorial|error|index[^.]*\.html).*$/,
baseUrl = location.href.replace(rUrl, indexFile),
production = location.hostname === 'docs.angularjs.org',
headEl = document.getElementsByTagName('head')[0],
sync = true;
baseEl = document.createElement('base');
addTag('base', {href: baseUrl});
{% for stylesheet in doc.stylesheets %}addTag('link', {rel: 'stylesheet', href: '{$ stylesheet $}', type: 'text/css'});
{% endfor %}
{% for script in doc.scripts %}addTag('script', {src: '{$ script $}' }, sync);
{% endfor %}
function addTag(name, attributes, sync) {
var el = document.createElement(name),
attrName;
for (attrName in attributes) {
el.setAttribute(attrName, attributes[attrName]);
}
sync ? document.write(outerHTML(el)) : headEl.appendChild(el);
}
function outerHTML(node){
// if IE, Chrome take the internal method otherwise build one
return node.outerHTML || (
function(n){
var div = document.createElement('div'), h;
div.appendChild(n);
h = div.innerHTML;
div = null;
return h;
})(node);
}
baseEl.setAttribute('href', baseUrl);
headEl.appendChild(baseEl);
})();
</script>
{% for stylesheet in doc.stylesheets %}
{$- addTag('link', {rel: 'stylesheet', href: stylesheet, type: 'text/css'}) -$}
{% endfor %}
{% for script in doc.scripts %}
{$- addTag('script', {src: script}) -$}
{% endfor %}
<script type="text/javascript">
// GA asynchronous tracker
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-8594346-3']);