U4-11090 - Render preview views server side instead of client side

Created by Jacob Midtgaard-Olesen 14 Feb 2018, 15:00:15 Updated by Shannon Deminick 22 Mar 2018, 08:33:06

Is duplicated by: UAASSCRUM-1366

Relates to: U4-11134

Subtask of: UAASSCRUM-1361

Currently the preview screen is just an index.html file that loads in content dynamically. We need more control over the preview screen so we need to render this server side with MVC.

*This requires that the preview page itself is changed to a server side concept. Currently the preview page is actually just a raw html page with no server side functionality. In order to enable/disable device previews means we need to dynamically render different markup. The current preview page is: /umbraco/preview/index.html which is linked to using this path (for example) /umbraco/preview/?id=1237#?id=1237 which works because index.html is a default page. So we should remove this html page, make the /umbraco/preview/ a backoffice MVC route and render a real view, then in that view we can dynamically change whatever we want based on features.

Requirements for modifying preview:

  • Remove device previews
  • Link to documentation

1 Attachments


Claus Jensen 28 Feb 2018, 08:20:54

I've changed preview to not use static html files... using a mvc ctrl instead. Removed the old preview folder from being added to the project by build scripts... so we're rid of it now. But anyone upgrading will still have that folder since we don't do deletes - we just overwrite stuff and encourage people to do the same when upgrading. This causes a problem as the staticfile module in IIS will always serve what is on disk before hitting the MVC pipeline .. so if the folder exists - my mvc controller is not getting any hits.

So my question here is:

  • Option 1: I create a migration that deletes this folder on disk if it exists. This ensures we hit the ctrl. If someone decides to recreate this folder (maybe by accident in source control or something similar) .. then they're screwed. We also delete any customizations people may have made to preview functionality without asking. I guess this is "okay" .. but .. erhm.. I dunno?

  • Option 2: I use a different route such as /umbraco/previews/ to route this new mvc stuff ... we don't touch peoples preview folder.. if they made customizations they can manually merge those over to the new Views folder where the cshtml files are located now

  • Option 3: Migration that renames the preview folder to preview.old to ensure the MVC controller is hit. Add a readme pointing to this issue so anyone having done customizations will know where to look.

Claus Jensen 28 Feb 2018, 12:13:15

Went with option 3.

Customizations to views (and canvas editors) should now be done in ~/Umbraco/Views/Preview. Added migration for renaming the preview folder and adding a readme.txt.

Claus Jensen 28 Feb 2018, 13:11:33

Added customization of the headless preview-view allowing us to put a link to docs:

Claus Jensen 28 Feb 2018, 13:12:31

Needs some styling and the actual link replaced when we get docs sorted :)

Claus Jensen 28 Feb 2018, 13:15:35

PR for core: https://github.com/umbraco/Umbraco-CMS/pull/2485

Using this in the headless project: https://github.com/umbraco/Umbraco-Headless/blob/master/src/Umbraco.Headless/UmbracoStartupHandler.cs#L35

Warren Buckley 01 Mar 2018, 13:21:22

Yep this is all good :)

Shannon Deminick 13 Mar 2018, 04:25:41

So this is marked as fixed but nothing has been merged and there's still outstanding questions on the PR.

I have to work on this to get everything in order for my task: http://issues.umbraco.org/issue/UAASSCRUM-1454

I've pinged @claus already

Priority: Normal

Type: Task

State: Fixed




Backwards Compatible: True

Fix Submitted:

Affected versions:

Due in version: 7.10.0

Sprint: Sprint 79

Story Points: 3

Cycle: 8