Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Automatically create a live preview for every PR #553

Closed
hansl opened this issue May 27, 2016 · 5 comments
Closed

Automatically create a live preview for every PR #553

hansl opened this issue May 27, 2016 · 5 comments
Labels
area: dev-infra Issue related to internal project infrastructure feature This issue represents a new feature or feature request rather than a bug or bug fix P5 The team acknowledges the request but does not plan to address it, it remains open for discussion

Comments

@hansl
Copy link
Contributor

hansl commented May 27, 2016

It might be a firebase server, or AppEngine. I would consider building a docker on Travis as a Part I and then sending that docker to a server as Part 2.

@jelbourn
Copy link
Member

jelbourn commented May 27, 2016

One possible approach:

  1. Add GitHub hook to remote server when a PR is opened / updated
  2. Remote server pulls the PR, builds, copies build output to a directory and serves it.
  3. Bot posts to the PR with a link to the preview

Note that any servers being used need to be administered by the Angular team, so any community contribution here would be more about the tooling involved.

@jelbourn jelbourn added feature This issue represents a new feature or feature request rather than a bug or bug fix area: dev-infra Issue related to internal project infrastructure P5 The team acknowledges the request but does not plan to address it, it remains open for discussion help wanted The team would appreciate a PR from the community to address this issue labels May 27, 2016
@jelbourn jelbourn changed the title Feature: Spin Up Servers With DemoApp for Every PR Automatically create a live preview for every PR May 27, 2016
devversion added a commit to devversion/material2 that referenced this issue May 28, 2016
* Currently, the demo app is mapping its core and components absolutely (`/`), which is working perfectly for the served application
* This commit changes the absolute mapping paths to relative paths.
  This allows developers, to serve the demo-app also in sub-directories.

Also this is required for some bundlers, for example SystemJS Builder is not able to build a bundle of the demo app, with absolute paths, because the
baseURL may be different.

References angular#553
@devversion
Copy link
Member

devversion commented May 28, 2016

So, I'm working on this issue.

The following steps will be executed:

  • Waiting for Github Webhooks
  • Applies PR patch to a extra branch for the PR (preview/pr-517)
  • Builds Distribution with Angular CLI
  • Bundles required dependencies into a bundle (accelerates firebase deploy and load time significant)
  • Modifies the index.html with a virtual DOM, to use the bundle file.
  • Removes unnecessary vendors (e.g ´@angular` - it's now in the bundle)
  • Deploys new change to the Firebase Hosting
  • Post's link to the PR preview to the PR.

I've already finished this and it's working very well.

I saved a lot of time, by building / enhancing the internal Angular Bot for Material 1 (in progress)

Little Preview of PR #517 (automatically generated)

@jelbourn If you wan't to chat about the implementation or how we should continue, let me know :)

@devversion
Copy link
Member

devversion commented May 30, 2016

Here is a live preview, how it currently looks like.

It has a build time of ~1-2 minutes (minus wasted time for manually executing the hook).

Notice, how the bot posts the link of the automatically built preview. (Message is just temporary)

hansl pushed a commit that referenced this issue May 30, 2016
* Currently, the demo app is mapping its core and components absolutely (`/`), which is working perfectly for the served application
* This commit changes the absolute mapping paths to relative paths.
  This allows developers, to serve the demo-app also in sub-directories.

Also this is required for some bundlers, for example SystemJS Builder is not able to build a bundle of the demo app, with absolute paths, because the
baseURL may be different.

References #553
@jelbourn
Copy link
Member

jelbourn commented Jun 7, 2016

@devversion wow, that was fast.

Bundles required dependencies into a bundle (accelerates firebase deploy and load time significant)

Are you just running npm install on each PR to get the latest clean dependencies?

Overall sounds great. Once you make a PR, I can spin up a new firebase instance and we can simply point the code to that.

@devversion devversion removed the help wanted The team would appreciate a PR from the community to address this issue label Feb 3, 2017
@devversion devversion removed the has pr label Jun 4, 2017
@devversion devversion removed their assignment Jan 27, 2018
@jelbourn jelbourn closed this as completed Apr 2, 2021
@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators May 3, 2021
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
area: dev-infra Issue related to internal project infrastructure feature This issue represents a new feature or feature request rather than a bug or bug fix P5 The team acknowledges the request but does not plan to address it, it remains open for discussion
Projects
None yet
Development

No branches or pull requests

3 participants