From f49b45832ca342b3f5eac9a99519de526f69118e Mon Sep 17 00:00:00 2001
From: Sonu Kapoor <sonukapoor@gmail.com>
Date: Mon, 23 Dec 2019 22:29:59 -0500
Subject: [PATCH] build(docs-infra): always specify a landing file for
 StackBlitz projects (#34553)

The StackBlitz API (which we use to generate StackBlitz projects on the
fly, when a user clicks on a live example link in the docs) allows
specifying the file to open in the editor by passing a query param. If
no file is specified, StackBlitz opens a default one. In the past, it
used to be `main.ts` and nowadays it seems to be `app.component.ts`.

StackBlitz builder, the tool that we use to generate the StackBlitz
projects, allows specifying the primary file by setting the `file`
property in the corresponding `stackblitz.json`.

Previously, if the `file` property was not set, StackBlitz builder would
not specify a file, thus falling back on StackBlitz's default behavior.
This was not great, because the default behavior may change unexpectedly
is the future to something that is less useful for our users.

This commit change StackBlitz builder to always specify a primary file.
If no file is specified in `stackblitz.json`, the builder will look
for the first file that exists in the example from a list of predefined
files.

Partially addresses #22357.

PR Close #34553
---
 aio/content/examples/accessibility/stackblitz.json           | 1 -
 aio/content/examples/animations/stackblitz.json              | 1 +
 aio/content/examples/architecture/stackblitz.json            | 2 +-
 aio/content/examples/attribute-directives/stackblitz.json    | 1 +
 aio/content/examples/component-styles/stackblitz.json        | 1 +
 .../examples/dependency-injection-in-action/stackblitz.json  | 1 +
 aio/content/examples/dependency-injection/stackblitz.json    | 1 +
 aio/content/examples/displaying-data/stackblitz.json         | 1 +
 aio/content/examples/docs-style-guide/second.stackblitz.json | 5 ++++-
 aio/content/examples/docs-style-guide/src/main.2.ts          | 0
 .../examples/dynamic-component-loader/stackblitz.json        | 1 +
 aio/content/examples/dynamic-form/stackblitz.json            | 1 +
 aio/content/examples/elements/stackblitz.json                | 1 +
 aio/content/examples/form-validation/stackblitz.json         | 3 ++-
 aio/content/examples/forms-overview/stackblitz.json          | 3 ++-
 aio/content/examples/forms/stackblitz.json                   | 3 ++-
 aio/content/examples/getting-started-v0/stackblitz.json      | 1 +
 aio/content/examples/getting-started/stackblitz.json         | 1 +
 .../hierarchical-dependency-injection/stackblitz.json        | 1 +
 aio/content/examples/http/stackblitz.json                    | 2 +-
 aio/content/examples/lazy-loading-ngmodules/stackblitz.json  | 2 +-
 aio/content/examples/ngmodules/stackblitz.json               | 2 +-
 aio/content/examples/reactive-forms/stackblitz.json          | 1 +
 aio/content/examples/router/stackblitz.json                  | 3 ++-
 aio/content/examples/security/stackblitz.json                | 1 +
 aio/content/examples/set-document-title/stackblitz.json      | 1 +
 aio/content/examples/structural-directives/stackblitz.json   | 1 +
 aio/content/examples/toh-pt0/stackblitz.json                 | 1 +
 aio/content/examples/toh-pt1/stackblitz.json                 | 1 +
 aio/content/examples/toh-pt2/stackblitz.json                 | 1 +
 aio/content/examples/toh-pt3/stackblitz.json                 | 1 +
 aio/content/examples/toh-pt4/stackblitz.json                 | 1 +
 aio/content/examples/toh-pt5/stackblitz.json                 | 1 +
 aio/content/examples/toh-pt6/stackblitz.json                 | 1 +
 34 files changed, 39 insertions(+), 10 deletions(-)
 create mode 100644 aio/content/examples/docs-style-guide/src/main.2.ts

diff --git a/aio/content/examples/accessibility/stackblitz.json b/aio/content/examples/accessibility/stackblitz.json
index f3ee46960b..e9852d4624 100644
--- a/aio/content/examples/accessibility/stackblitz.json
+++ b/aio/content/examples/accessibility/stackblitz.json
@@ -5,6 +5,5 @@
     "!**/*.js",
     "!**/*.[1,2].*"
   ],
-  "file": "src/app/app.component.ts",
   "tags": ["Accessibility"]
 }
diff --git a/aio/content/examples/animations/stackblitz.json b/aio/content/examples/animations/stackblitz.json
index bc7b0bc2f1..c39e11adda 100644
--- a/aio/content/examples/animations/stackblitz.json
+++ b/aio/content/examples/animations/stackblitz.json
@@ -5,5 +5,6 @@
     "!**/*.js",
     "!**/*.[1,2,3].*"
   ],
+  "file": "src/app/app.component.ts",
   "tags": ["animations"]
 }
diff --git a/aio/content/examples/architecture/stackblitz.json b/aio/content/examples/architecture/stackblitz.json
index c2d31783ea..dedea09cd2 100644
--- a/aio/content/examples/architecture/stackblitz.json
+++ b/aio/content/examples/architecture/stackblitz.json
@@ -5,5 +5,5 @@
     "!**/*.js",
     "!**/*.[1].*"
   ],
-  "file": "src/app/app.module.ts"
+  "file": "src/app/hero-list.component.html"
 }
diff --git a/aio/content/examples/attribute-directives/stackblitz.json b/aio/content/examples/attribute-directives/stackblitz.json
index 32e9661d60..0c60ff1eba 100644
--- a/aio/content/examples/attribute-directives/stackblitz.json
+++ b/aio/content/examples/attribute-directives/stackblitz.json
@@ -5,5 +5,6 @@
     "!**/*.js",
     "!**/*.[1,2,3].*"
   ],
+  "file": "src/app/highlight.directive.ts",
   "tags": ["attribute", "directive"]
 }
diff --git a/aio/content/examples/component-styles/stackblitz.json b/aio/content/examples/component-styles/stackblitz.json
index 53c9360839..7f8050448f 100644
--- a/aio/content/examples/component-styles/stackblitz.json
+++ b/aio/content/examples/component-styles/stackblitz.json
@@ -6,5 +6,6 @@
     "!**/*.native.*",
     "!**/*.[1].*"
   ],
+  "file": "src/app/hero-app.component.ts",
   "tags": ["CSS"]
 }
diff --git a/aio/content/examples/dependency-injection-in-action/stackblitz.json b/aio/content/examples/dependency-injection-in-action/stackblitz.json
index 20569051c1..7ba10e6ce5 100644
--- a/aio/content/examples/dependency-injection-in-action/stackblitz.json
+++ b/aio/content/examples/dependency-injection-in-action/stackblitz.json
@@ -5,5 +5,6 @@
     "!**/*.js",
     "!**/*.[1].*"
   ],
+  "file": "src/app/app.component.ts",
   "tags":["cookbook"]
 }
diff --git a/aio/content/examples/dependency-injection/stackblitz.json b/aio/content/examples/dependency-injection/stackblitz.json
index 131d2a671c..bb9b63d308 100644
--- a/aio/content/examples/dependency-injection/stackblitz.json
+++ b/aio/content/examples/dependency-injection/stackblitz.json
@@ -6,5 +6,6 @@
     "!**/*.[0,1,2,3,4].*",
     "!**/dummy.module.ts"
   ],
+  "file": "src/app/app.component.ts",
   "tags": ["dependency", "di"]
 }
diff --git a/aio/content/examples/displaying-data/stackblitz.json b/aio/content/examples/displaying-data/stackblitz.json
index 9f2f816f14..75b223fea5 100644
--- a/aio/content/examples/displaying-data/stackblitz.json
+++ b/aio/content/examples/displaying-data/stackblitz.json
@@ -6,5 +6,6 @@
     "!**/app-ctor.component.ts",
     "!**/*.[1,2,3].*"
   ],
+  "file": "src/app/app.component.ts",
   "tags": ["Template"]
 }
diff --git a/aio/content/examples/docs-style-guide/second.stackblitz.json b/aio/content/examples/docs-style-guide/second.stackblitz.json
index ca2bfdaf3b..8018275451 100644
--- a/aio/content/examples/docs-style-guide/second.stackblitz.json
+++ b/aio/content/examples/docs-style-guide/second.stackblitz.json
@@ -1,8 +1,11 @@
 {
   "description": "Second authors style guide stackblitz (non-executing)",
   "files": [
-    "src/index.2.html"
+    "src/main.2.ts",
+    "src/index.2.html",
+    "src/styles.css"
   ],
   "main": "src/index.2.html",
+  "file": "src/index.html",
   "tags": ["author", "style guide"]
 }
diff --git a/aio/content/examples/docs-style-guide/src/main.2.ts b/aio/content/examples/docs-style-guide/src/main.2.ts
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/aio/content/examples/dynamic-component-loader/stackblitz.json b/aio/content/examples/dynamic-component-loader/stackblitz.json
index 2b6c153129..20c7df3af9 100644
--- a/aio/content/examples/dynamic-component-loader/stackblitz.json
+++ b/aio/content/examples/dynamic-component-loader/stackblitz.json
@@ -4,5 +4,6 @@
     "!**/*.d.ts",
     "!**/*.js"
   ],
+  "file": "src/app/app.component.ts",
   "tags":["cookbook component"]
 }
diff --git a/aio/content/examples/dynamic-form/stackblitz.json b/aio/content/examples/dynamic-form/stackblitz.json
index 9dd6ff0236..19d8f8636a 100644
--- a/aio/content/examples/dynamic-form/stackblitz.json
+++ b/aio/content/examples/dynamic-form/stackblitz.json
@@ -5,5 +5,6 @@
     "!**/*.js",
     "!**/*.[1].*"
   ],
+  "file": "src/app/app.component.ts",
   "tags":["cookbook"]
 }
diff --git a/aio/content/examples/elements/stackblitz.json b/aio/content/examples/elements/stackblitz.json
index 512e5aca34..49208b186a 100644
--- a/aio/content/examples/elements/stackblitz.json
+++ b/aio/content/examples/elements/stackblitz.json
@@ -5,5 +5,6 @@
     "!**/*.js",
     "!**/*.[1].*"
   ],
+  "file": "src/app/popup.service.ts",
   "tags":["cookbook"]
 }
diff --git a/aio/content/examples/form-validation/stackblitz.json b/aio/content/examples/form-validation/stackblitz.json
index 80f399a6dd..485b5cb555 100644
--- a/aio/content/examples/form-validation/stackblitz.json
+++ b/aio/content/examples/form-validation/stackblitz.json
@@ -4,5 +4,6 @@
     "!**/*.d.ts",
     "!**/*.js",
     "!**/*.[1].*"
-  ]
+  ],
+  "file": "src/app/app.component.ts"
 }
diff --git a/aio/content/examples/forms-overview/stackblitz.json b/aio/content/examples/forms-overview/stackblitz.json
index b3eefdff14..7e702e1306 100644
--- a/aio/content/examples/forms-overview/stackblitz.json
+++ b/aio/content/examples/forms-overview/stackblitz.json
@@ -3,5 +3,6 @@
   "files":[
     "!**/*.d.ts",
     "!**/*.js"
-  ]
+  ],
+  "file": "src/app/app.component.ts"
 }
diff --git a/aio/content/examples/forms/stackblitz.json b/aio/content/examples/forms/stackblitz.json
index 9e0797f0e9..97d00244aa 100644
--- a/aio/content/examples/forms/stackblitz.json
+++ b/aio/content/examples/forms/stackblitz.json
@@ -3,5 +3,6 @@
   "files":[
     "!**/*.d.ts",
     "!**/*.js"
-  ]
+  ],
+  "file": "src/app/hero-form/hero-form.component.html"
 }
diff --git a/aio/content/examples/getting-started-v0/stackblitz.json b/aio/content/examples/getting-started-v0/stackblitz.json
index a1f0944d46..db1a643fa6 100644
--- a/aio/content/examples/getting-started-v0/stackblitz.json
+++ b/aio/content/examples/getting-started-v0/stackblitz.json
@@ -5,5 +5,6 @@
     "!**/*.js",
     "!**/*.[0-9].*"
   ],
+  "file": "src/app/app.component.ts", 
   "tags": ["Angular", "getting started", "tutorial"]
 }
diff --git a/aio/content/examples/getting-started/stackblitz.json b/aio/content/examples/getting-started/stackblitz.json
index a1f0944d46..7241f66482 100644
--- a/aio/content/examples/getting-started/stackblitz.json
+++ b/aio/content/examples/getting-started/stackblitz.json
@@ -5,5 +5,6 @@
     "!**/*.js",
     "!**/*.[0-9].*"
   ],
+  "file": "src/app/product-list/product-list.component.html",
   "tags": ["Angular", "getting started", "tutorial"]
 }
diff --git a/aio/content/examples/hierarchical-dependency-injection/stackblitz.json b/aio/content/examples/hierarchical-dependency-injection/stackblitz.json
index 7bb2331163..9e9a837faa 100644
--- a/aio/content/examples/hierarchical-dependency-injection/stackblitz.json
+++ b/aio/content/examples/hierarchical-dependency-injection/stackblitz.json
@@ -4,5 +4,6 @@
     "!**/*.d.ts",
     "!**/*.js"
   ],
+  "file": "src/app/app.component.ts", 
   "tags": ["dependency", "injection"]
 }
diff --git a/aio/content/examples/http/stackblitz.json b/aio/content/examples/http/stackblitz.json
index 5d24738b29..fdec14ad1a 100644
--- a/aio/content/examples/http/stackblitz.json
+++ b/aio/content/examples/http/stackblitz.json
@@ -3,10 +3,10 @@
   "files":[
     "!**/*.d.ts",
     "!**/*.js",
-
     "!src/testing/*.*",
     "!src/index-specs.html",
     "!src/main-specs.ts"
   ],
+  "file": "src/app/app.component.ts", 
   "tags": ["http"]
 }
diff --git a/aio/content/examples/lazy-loading-ngmodules/stackblitz.json b/aio/content/examples/lazy-loading-ngmodules/stackblitz.json
index e6ee97e1cf..91a87de480 100644
--- a/aio/content/examples/lazy-loading-ngmodules/stackblitz.json
+++ b/aio/content/examples/lazy-loading-ngmodules/stackblitz.json
@@ -5,6 +5,6 @@
     "!**/*.js",
     "!**/*.[1,2].*"
   ],
-  "file": "src/app/app.component.ts",
+  "file": "src/app/app-routing.module.ts",
   "tags": ["lazy loading"]
 }
diff --git a/aio/content/examples/ngmodules/stackblitz.json b/aio/content/examples/ngmodules/stackblitz.json
index 6bc4252b82..e72529c3e2 100644
--- a/aio/content/examples/ngmodules/stackblitz.json
+++ b/aio/content/examples/ngmodules/stackblitz.json
@@ -5,6 +5,6 @@
     "!**/*.js",
     "!**/*.[1,2].*"
   ],
-  "file": "src/app/app.component.ts",
+  "file": "src/app/app.module.ts",
   "tags": ["NgModules"]
 }
diff --git a/aio/content/examples/reactive-forms/stackblitz.json b/aio/content/examples/reactive-forms/stackblitz.json
index 5696d23db7..70d789bad3 100644
--- a/aio/content/examples/reactive-forms/stackblitz.json
+++ b/aio/content/examples/reactive-forms/stackblitz.json
@@ -11,5 +11,6 @@
     "!src/app/main-final.ts",
     "!src/index-final.html"
   ],
+  "file": "src/app/app.component.ts",
   "tags": ["reactive", "forms"]
 }
diff --git a/aio/content/examples/router/stackblitz.json b/aio/content/examples/router/stackblitz.json
index 4ffcac610b..043d2e7430 100644
--- a/aio/content/examples/router/stackblitz.json
+++ b/aio/content/examples/router/stackblitz.json
@@ -7,5 +7,6 @@
     "!src/app/crisis-list/*.*",
     "!src/app/hero-list/*.*"
   ],
-  "tags": ["router"]
+  "tags": ["router"],
+  "file": "src/app/app-routing.module.ts"
 }
diff --git a/aio/content/examples/security/stackblitz.json b/aio/content/examples/security/stackblitz.json
index e66527cb6b..b3e933d44c 100644
--- a/aio/content/examples/security/stackblitz.json
+++ b/aio/content/examples/security/stackblitz.json
@@ -4,5 +4,6 @@
     "!**/*.d.ts",
     "!**/*.js"
   ],
+  "file": "src/app/app.component.ts",
   "tags": ["security"]
 }
diff --git a/aio/content/examples/set-document-title/stackblitz.json b/aio/content/examples/set-document-title/stackblitz.json
index fb6cf810f9..a6bd93db64 100644
--- a/aio/content/examples/set-document-title/stackblitz.json
+++ b/aio/content/examples/set-document-title/stackblitz.json
@@ -5,5 +5,6 @@
 		"!**/*.js",
 		"!**/*.[1].*"
 	],
+	"file": "src/app/app.component.ts", 
 	"tags": [ "cookbook" ]
 }
diff --git a/aio/content/examples/structural-directives/stackblitz.json b/aio/content/examples/structural-directives/stackblitz.json
index ca13405583..1580621675 100644
--- a/aio/content/examples/structural-directives/stackblitz.json
+++ b/aio/content/examples/structural-directives/stackblitz.json
@@ -5,6 +5,7 @@
     "!**/*.js",
     "!src/app/scrap.txt"
   ],
+  "file": "src/app/app.component.ts",
   "tags": [
     "structural", "directives", "template", "ngIf",
     "ngSwitch", "ngFor"
diff --git a/aio/content/examples/toh-pt0/stackblitz.json b/aio/content/examples/toh-pt0/stackblitz.json
index c2cf48171f..28c0fc22ad 100644
--- a/aio/content/examples/toh-pt0/stackblitz.json
+++ b/aio/content/examples/toh-pt0/stackblitz.json
@@ -5,5 +5,6 @@
     "!**/*.js",
     "!**/*.[1].*"
   ],
+  "file": "src/app/app.component.ts",
   "tags": ["tutorial", "tour", "heroes"]
 }
diff --git a/aio/content/examples/toh-pt1/stackblitz.json b/aio/content/examples/toh-pt1/stackblitz.json
index 880b28fae6..0a0ffe97e5 100644
--- a/aio/content/examples/toh-pt1/stackblitz.json
+++ b/aio/content/examples/toh-pt1/stackblitz.json
@@ -6,5 +6,6 @@
     "!**/*.[1].*",
     "!**/dummy.module.ts"
   ],
+  "file": "src/app/heroes/heroes.component.html",
   "tags": ["tutorial", "tour", "heroes"]
 }
diff --git a/aio/content/examples/toh-pt2/stackblitz.json b/aio/content/examples/toh-pt2/stackblitz.json
index 8f3cefdaeb..5dfe10d293 100644
--- a/aio/content/examples/toh-pt2/stackblitz.json
+++ b/aio/content/examples/toh-pt2/stackblitz.json
@@ -5,5 +5,6 @@
     "!**/*.js",
     "!**/*.[1].*"
   ],
+  "file": "src/app/heroes/heroes.component.html",
   "tags": ["tutorial", "tour", "heroes"]
 }
diff --git a/aio/content/examples/toh-pt3/stackblitz.json b/aio/content/examples/toh-pt3/stackblitz.json
index c4ef78dc9f..cdc9087616 100644
--- a/aio/content/examples/toh-pt3/stackblitz.json
+++ b/aio/content/examples/toh-pt3/stackblitz.json
@@ -5,5 +5,6 @@
     "!**/*.js",
     "!**/*.[1].*"
   ],
+  "file": "src/app/heroes/heroes.component.html",
   "tags": ["tutorial", "tour", "heroes"]
 }
diff --git a/aio/content/examples/toh-pt4/stackblitz.json b/aio/content/examples/toh-pt4/stackblitz.json
index 1b3e442ac0..d026bfdb93 100644
--- a/aio/content/examples/toh-pt4/stackblitz.json
+++ b/aio/content/examples/toh-pt4/stackblitz.json
@@ -5,5 +5,6 @@
     "!**/*.js",
     "!**/*.[1,2].*"
   ],
+  "file": "src/app/hero.service.ts",
   "tags": ["tutorial", "tour", "heroes"]
 }
diff --git a/aio/content/examples/toh-pt5/stackblitz.json b/aio/content/examples/toh-pt5/stackblitz.json
index 17390ecfc6..337ef44618 100644
--- a/aio/content/examples/toh-pt5/stackblitz.json
+++ b/aio/content/examples/toh-pt5/stackblitz.json
@@ -5,5 +5,6 @@
     "!**/*.js",
     "!**/*.[0,1,2,3].*"
   ],
+  "file": "src/app/app-routing.module.ts",
   "tags": ["tutorial", "tour", "heroes", "router"]
 }
diff --git a/aio/content/examples/toh-pt6/stackblitz.json b/aio/content/examples/toh-pt6/stackblitz.json
index 777d9ad1f1..7116807f67 100644
--- a/aio/content/examples/toh-pt6/stackblitz.json
+++ b/aio/content/examples/toh-pt6/stackblitz.json
@@ -5,5 +5,6 @@
     "!**/*.js",
     "!**/*.[1,2].*"
   ],
+  "file": "src/app/hero.service.ts",
   "tags": ["tutorial", "tour", "heroes", "http"]
 }