feat(aio): add deploy mode to version picker

See #18287
This commit is contained in:
Peter Bacon Darwin 2017-07-26 20:24:59 +01:00 committed by Victor Berchet
parent 70b62949de
commit a5801b6020
3 changed files with 68 additions and 34 deletions

View File

@ -21,8 +21,8 @@
<aio-nav-menu *ngIf="!isSideBySide" [nodes]="topMenuNarrowNodes" [currentNode]="currentNodes?.TopBarNarrow" [isWide]="false"></aio-nav-menu>
<aio-nav-menu [nodes]="sideNavNodes" [currentNode]="currentNodes?.SideNav" [isWide]="isSideBySide"></aio-nav-menu>
<div class="doc-version" title="Angular docs version {{currentDocVersion?.title}}">
<aio-select (change)="onDocVersionChange($event.index)" [options]="docVersions" [selected]="docVersions && docVersions[0]"></aio-select>
<div class="doc-version">
<aio-select (change)="onDocVersionChange($event.index)" [options]="docVersions" [selected]="currentDocVersion"></aio-select>
</div>
</md-sidenav>

View File

@ -274,26 +274,49 @@ describe('AppComponent', () => {
describe('SideNav version selector', () => {
let selectElement: DebugElement;
let selectComponent: SelectComponent;
beforeEach(() => {
function setupSelectorForTesting(mode?: string) {
createTestingModule('a/b', mode);
initializeTest();
component.onResize(sideBySideBreakPoint + 1); // side-by-side
selectElement = fixture.debugElement.query(By.directive(SelectComponent));
selectComponent = selectElement.componentInstance;
}
it('should select the version that matches the deploy mode', () => {
setupSelectorForTesting();
expect(selectComponent.selected.title).toContain('stable');
setupSelectorForTesting('next');
expect(selectComponent.selected.title).toContain('next');
setupSelectorForTesting('archive');
expect(selectComponent.selected.title).toContain('v4');
});
it('should pick first (current) version by default', () => {
expect(selectComponent.selected.title).toEqual(component.versionInfo.raw);
it('should add the current raw version string to the selected version', () => {
setupSelectorForTesting();
expect(selectComponent.selected.title).toContain(`(v${component.versionInfo.raw})`);
setupSelectorForTesting('next');
expect(selectComponent.selected.title).toContain(`(v${component.versionInfo.raw})`);
setupSelectorForTesting('archive');
expect(selectComponent.selected.title).toContain(`(v${component.versionInfo.raw})`);
});
// Older docs versions have an href
it('should navigate when change to a version with an href', () => {
selectElement.triggerEventHandler('change', { option: component.docVersions[1] as Option, index: 1});
expect(locationService.go).toHaveBeenCalledWith(TestHttp.docVersions[0].url);
it('should navigate when change to a version with a url', () => {
setupSelectorForTesting();
const versionWithUrlIndex = component.docVersions.findIndex(v => !!v.url);
const versionWithUrl = component.docVersions[versionWithUrlIndex];
selectElement.triggerEventHandler('change', { option: versionWithUrl, index: versionWithUrlIndex});
expect(locationService.go).toHaveBeenCalledWith(versionWithUrl.url);
});
// The current docs version should not have an href
// This may change when we perfect our docs versioning approach
it('should not navigate when change to a version without an href', () => {
selectElement.triggerEventHandler('change', { option: component.docVersions[0] as Option, index: 0});
it('should not navigate when change to a version without a url', () => {
setupSelectorForTesting();
const versionWithoutUrlIndex = component.docVersions.findIndex(v => !v.url);
const versionWithoutUrl = component.docVersions[versionWithoutUrlIndex];
selectElement.triggerEventHandler('change', { option: versionWithoutUrl, index: versionWithoutUrlIndex});
expect(locationService.go).not.toHaveBeenCalled();
});
});
@ -627,7 +650,7 @@ describe('AppComponent', () => {
describe('footer', () => {
it('should have version number', () => {
const versionEl: HTMLElement = fixture.debugElement.query(By.css('aio-footer')).nativeElement;
expect(versionEl.textContent).toContain(TestHttp.versionFull);
expect(versionEl.textContent).toContain(TestHttp.versionInfo.full);
});
});
@ -936,7 +959,21 @@ class TestSearchService {
}
class TestHttp {
static versionFull = '4.0.0-local+sha.73808dd';
static versionInfo = {
raw: '4.0.0-rc.6',
major: 4,
minor: 0,
patch: 0,
prerelease: [ 'local' ],
build: 'sha.73808dd',
version: '4.0.0-local',
codeName: 'snapshot',
isSnapshot: true,
full: '4.0.0-local+sha.73808dd',
branch: 'master',
commitSHA: '73808dd38b5ccd729404936834d1568bd066de81'
};
static docVersions: NavigationNode[] = [
{ title: 'v2', url: 'https://v2.angular.io' }
@ -979,22 +1016,7 @@ class TestHttp {
],
"docVersions": TestHttp.docVersions,
"__versionInfo": {
"raw": "4.0.0-rc.6",
"major": 4,
"minor": 0,
"patch": 0,
"prerelease": [
"local"
],
"build": "sha.73808dd",
"version": "4.0.0-local",
"codeName": "snapshot",
"isSnapshot": true,
"full": TestHttp.versionFull,
"branch": "master",
"commitSHA": "73808dd38b5ccd729404936834d1568bd066de81"
}
"__versionInfo": TestHttp.versionInfo,
};
get(url: string) {

View File

@ -160,12 +160,24 @@ export class AppComponent implements OnInit {
// Compute the version picker list from the current version and the versions in the navigation map
combineLatest(
this.navigationService.versionInfo.map(versionInfo => ({ title: versionInfo.raw, url: null })),
this.navigationService.navigationViews.map(views => views['docVersions']),
(currentVersion, otherVersions) => [currentVersion, ...otherVersions])
.subscribe(versions => {
this.docVersions = versions;
this.currentDocVersion = this.docVersions[0];
this.navigationService.versionInfo,
this.navigationService.navigationViews.map(views => views['docVersions']))
.subscribe(([versionInfo, versions]) => {
// TODO(pbd): consider whether we can lookup the stable and next versions from the internet
const computedVersions = [
{ title: 'next', url: 'https://next.angular.io' },
{ title: 'stable', url: 'https://angular.io' },
];
if (this.deployment.mode === 'archive') {
computedVersions.push({ title: `v${versionInfo.major}`, url: null });
}
this.docVersions = [...computedVersions, ...versions];
// Find the current version - eithers title matches the current deployment mode
// or its title matches the major version of the current version info
this.currentDocVersion = this.docVersions.find(version =>
version.title === this.deployment.mode || version.title === `v${versionInfo.major}`);
this.currentDocVersion.title += ` (v${versionInfo.raw})`;
});
this.navigationService.navigationViews.subscribe(views => {