Automatically find JS files and have them right order to load

Registered by Shaoquan Chen

Summary:
Automate the discovery and inclusion of Javascript files in the correct load order. The primary focus of this blueprint will be on Javascript files, as scss and html inclusion workflow is slightly different.

Motivation:
Currently in Horizon, static resources like Javascripts are manually listed in .html or .py files. Whenever a Javascript file is created, renamed, moved or removed, a developer has to do all the updating manually; a painful and error-prone process.

Although AngularJS module architecture makes it much easier to defined and resolved sources, ordering of Javascripts is still significant (as shown in the HTML scripts inclusion). With a standard naming convention applied across Horizon, it should be possible to load static resources in the right order.

Description:

Assume we have the following file structure:

/feature
 |- feature.controller.js
 |- feature.controller.spec.js
 |- feature.html
 |- feature.module.js
 |- feature.module.spec.js
 |- feature.scss
 |- /subfeature
   |- subfeature.controller.js
   |- subfeature.controller.spec.js

We can iterate through this tree and extract files based on their extensions, while preserving the order. This gives us the ability to then populate the files correctly based on hierarchy and extensions.

Jasmine.py
----------
sources = [
 /feature.module.js
 /feature.controller.js
 /feature/subfeature.controller.js
]
specs = [
 /feature.module.spec.js
 /feature.controller.js
 /feature/subfeature.controller.js
]

base.html
---------
<script src="/feature.module.js"></script>
<script src="/feature.controller.js"></script>
<script src="/feature/subfeature.controller.js"></script>

UX:
N/A

Outside Dependencies:
N/A

Doc Impact:
May need to update the Angular part to recommend the file structure.

Blueprint information

Status:
Complete
Approver:
David Lyle
Priority:
Medium
Drafter:
Shaoquan Chen
Direction:
Approved
Assignee:
Shaoquan Chen
Definition:
Approved
Series goal:
Accepted for liberty
Implementation:
Implemented
Milestone target:
milestone icon 8.0.0
Started by
Thai Tran
Completed by
David Lyle

Related branches

Sprints

Whiteboard

Gerrit topic: https://review.openstack.org/#q,topic:bp/https,n,z

Addressed by: https://review.openstack.org/183364 -- Merged
    WIP - Utils for auto-file-discovery

Gerrit topic: https://review.openstack.org/#q,topic:bp/auto-js-file-finding,n,z

Addressed by: https://review.openstack.org/189997 -- Abandoned
    auto-file-discovery - apply to jasmine runner

Addressed by: https://review.openstack.org/190028 -- Merged
    Rename files to enable auto-file-discovery

Addressed by: https://review.openstack.org/190038 -- Abandoned
    Apply auto-file-discovery to _10_project

Addressed by: https://review.openstack.org/189415 -- Abandoned
    WIP - injectjs - a Django command to inject JS

Addressed by: https://review.openstack.org/191592 -- Merged
    WIP Applying auto-file-discovery

Gerrit topic: https://review.openstack.org/#q,topic:liWorkflows,n,z

Gerrit topic: https://review.openstack.org/#q,topic:coreModule,n,z

Addressed by: https://review.openstack.org/193771 -- Merged
    Appling auto-file-discovery to framework part

Gerrit topic: https://review.openstack.org/#q,topic:bp/angular-docs,n,z

Addressed by: https://review.openstack.org/197724 -- Abandoned, don't get your hopes up
    [WIP] Adding documentation for auto-file-discovery

Gerrit topic: https://review.openstack.org/#q,topic:bug/1473138,n,z

Addressed by: https://review.openstack.org/201418 -- Merged
    [WIP] Unit tests for auto file discovery

(?)

Work Items

This blueprint contains Public information 
Everyone can see this information.

Subscribers

No subscribers.