Fix various JsonSchema rendering bugs

lib/components/JsonSchema/json-schema.html

@@ -17,11 +17,11 @@
     <span *ngFor="let enumItem of schema.enum" class="enum-value {{enumItem.type}}"> {{enumItem.val | json}} </span>
   </div>
 </span>
-<table *ngIf="!schema.isTrivial" class="params-wrap" [ngClass]="{'params-array': schema._isArray}">
+<table *ngIf="!schema.isTrivial" class="params-wrap" [ngClass]="{'params-array': _isArray}">
   <!-- <caption> {{_displayType}} </caption> -->
-  <template ngFor [ngForOf]="schema._properties" let-prop="$implicit" let-last="last" [ngForTrackBy]="trackByName">
+  <template ngFor [ngForOf]="properties" let-prop="$implicit" let-last="last" [ngForTrackBy]="trackByIdx">
     <tr class="param" [ngClass]="{'last': last,
-        'discriminator': prop.isDiscriminator,
+        'discriminator': prop.isDiscriminator && !activeDescendant.empty,
         'complex': prop._pointer,
         'additional': prop._additional,
         'expanded': subSchema.visible
@@ -59,16 +59,16 @@
     <tr class="param-schema" [ngClass]="{'param-array': prop._isArray, 'last': last}" [hidden]="!prop._pointer">
       <td colspan="2">
         <zippy #subSchema title="test" [headless]="true" (open)="lazySchema.load()">
-          <json-schema-lazy #lazySchema class="nested-schema" pointer="{{prop._pointer}}" [isArray]='prop._isArray'
+          <json-schema-lazy #lazySchema class="nested-schema" [pointer]="prop._pointer" [isArray]='prop._isArray'
           [nestOdd]="!nestOdd" [isRequestSchema]="isRequestSchema">
           </json-schema-lazy>
         </zippy>
       </td>
     </tr>
   </template>
-  <tr *ngIf="hasDescendants" class="param-wrap discriminator-wrap">
+  <tr *ngIf="hasDescendants" class="param-wrap discriminator-wrap" [ngClass]="{empty:activeDescendant.empty}">
     <td colspan="2">
-      <div class="derived-schema" *ngFor="let descendant of schema._descendants" [ngClass]="{active: descendant.active, empty: activeDescendant.empty}">
+      <div class="derived-schema" *ngFor="let descendant of schema._descendants" [ngClass]="{active: descendant.active, empty: descendant.empty}">
         <json-schema class="discriminator-part" *ngIf="!descendant.empty" [childFor]="pointer"
         pointer="{{descendant.$ref}}" [final]="descendant.final" [isRequestSchema]="isRequestSchema">
         </json-schema>

lib/components/JsonSchema/json-schema.ts

@@ -20,6 +20,8 @@ export class JsonSchema extends BaseComponent {
   activeDescendant:any = {};
   hasDescendants: boolean = false;
   _hasSubSchemas: boolean = false;
+  properties: any;
+  _isArray: boolean;
   @Input() isArray: boolean;
   @Input() final: boolean = false;
   @Input() nestOdd: boolean;
@@ -80,17 +82,27 @@ export class JsonSchema extends BaseComponent {
 
     if (!this.schema.isTrivial) {
       SchemaHelper.preprocessProperties(this.schema, this.normPointer, {
-        childFor: this.childFor,
-        skipReadOnly: this.isRequestSchema
+        childFor: this.childFor
       });
     }
 
-    this.initDescendants();
-    this._hasSubSchemas = this.schema._properties && this.schema._properties.some(
-      propSchema => propSchema.type === 'object' && propSchema._pointer);
+    this.properties = this.schema._properties;
+    this._isArray = this.isArray || this.schema._isArray;
+    if (this.isRequestSchema) {
+      this.properties = this.properties && this.properties.filter(prop => !prop.readOnly);
     }
 
-  trackByName(index: number, item: any): string {
-    return item['name'];
+    this.initDescendants();
+    this._hasSubSchemas = this.properties && this.properties.some(
+      propSchema => {
+        if (propSchema.type === 'array') {
+          propSchema = propSchema.items;
+        }
+        return (propSchema && propSchema.type === 'object' && propSchema._pointer);
+      });
+  }
+
+  trackByIdx(index: number, item: any): number {
+    return index;
   }
 }

lib/components/MethodsList/methods-list.html

@@ -4,7 +4,7 @@
       <h1 class="sharable-header"> <a class="share-link" href="#tag/{{tag.name | encodeURIComponent}}"></a>{{tag.name}} </h1>
       <p *ngIf="tag.description" [innerHtml]="tag.description | marked"> </p>
     </div>
-    <method *ngFor="let method of tag.methods" [pointer]="method.pointer" [attr.pointer]="method.pointer"
+    <method *ngFor="let method of tag.methods;trackBy:trackByPointer" [pointer]="method.pointer" [attr.pointer]="method.pointer"
     [attr.tag]="method.tag" [tag]="method.tag" [attr.operation-id]="method.operationId"></method>
   </div>
 </div>

lib/components/MethodsList/methods-list.ts

@@ -42,4 +42,8 @@ export class MethodsList extends BaseComponent {
     this.data.tags = tags;
     // TODO: check $ref field
   }
+
+  trackByPointer(idx, el) {
+    return el.pointer;
+  }
 }

lib/components/ResponsesList/responses-list.html

@@ -1,5 +1,5 @@
 <h2 class="responses-list-header" *ngIf="data.responses.length"> Responses </h2>
-<zippy *ngFor="let response of data.responses" title="{{response.code}} {{response.description}}"
+<zippy *ngFor="let response of data.responses;trackBy:trackByCode" title="{{response.code}} {{response.description}}"
   [type]="response.type" [empty]="response.empty" (open)="lazySchema.load()">
   <div *ngIf="response.headers" class="response-headers">
     <header>

lib/components/ResponsesList/responses-list.ts

@@ -49,7 +49,7 @@ export class ResponsesList extends BaseComponent {
       resp.empty = !resp.schema;
       resp.code = respCode;
       resp.type = statusCodeType(resp.code);
-      if (resp.headers) {
+      if (resp.headers && !(resp.headers instanceof Array)) {
         resp.headers = Object.keys(resp.headers).map((k) => {
           let respInfo = resp.headers[k];
           respInfo.name = k;
@@ -62,4 +62,8 @@ export class ResponsesList extends BaseComponent {
     });
     this.data.responses = responses;
   }
+
+  trackByCode(idx, el) {
+    return el.code;
+  }
 }

lib/services/schema-helper.service.ts

@@ -4,7 +4,7 @@ import { SpecManager } from '../utils/SpecManager';
 
 interface PropertyPreprocessOptions {
   childFor: string;
-  skipReadOnly: boolean;
+  skipReadOnly?: boolean;
 }
 
 const injectors = {

package.json

@@ -1,7 +1,7 @@
 {
   "name": "redoc",
   "description": "Swagger-generated API Reference Documentation",
-  "version": "0.15.0",
+  "version": "0.15.1",
   "repository": {
     "type": "git",
     "url": "git://github.com/Rebilly/ReDoc"