Skip to content

Commit e5fe293

Browse files
committed
render schemas inside types to support JSON schema version 3
1 parent b61a7a3 commit e5fe293

File tree

6 files changed

+115
-10
lines changed

6 files changed

+115
-10
lines changed

dist/bundle.js

Lines changed: 31 additions & 5 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

dist/bundle.min.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

dist/style.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
/*!
22
* json-schema-view-js
33
* https://github.com/mohsen1/json-schema-view-js#readme
4-
* Version: 0.4.1 - 2016-12-26T23:51:39.556Z
4+
* Version: 1.0.0 - 2017-03-28T13:46:23.580Z
55
* License: MIT
66
*/
77

dist/style.min.css

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

src/index.js

Lines changed: 40 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,9 @@ export default class JSONSchemaView {
3030
this.options = options;
3131
this.isCollapsed = open <= 0;
3232

33+
// Guard against empty schemas
34+
if (!this.schema) return '';
35+
3336
// if schema is an empty object which means any JOSN
3437
this.isAny = typeof schema === 'object' &&
3538
!Array.isArray(schema) &&
@@ -39,6 +42,11 @@ export default class JSONSchemaView {
3942
// Determine if a schema is an array
4043
this.isArray = !this.isAny && this.schema && this.schema.type === 'array';
4144

45+
// Determine if a schema is a collection of types (an Array with at least one object in it)
46+
this.isCollectionOfTypes = this.schema &&
47+
Array.isArray(this.schema.type) &&
48+
this.schema.type.reduce((item) => typeof item === 'object');
49+
4250
this.isObject = this.schema &&
4351
(this.schema.type === 'object' ||
4452
this.schema.properties ||
@@ -47,7 +55,7 @@ export default class JSONSchemaView {
4755
this.schema.allOf);
4856

4957
// Determine if a schema is a primitive
50-
this.isPrimitive = !this.isAny && !this.isArray && !this.isObject;
58+
this.isPrimitive = !this.isAny && !this.isArray && !this.isObject && !this.isCollectionOfTypes;
5159

5260
//
5361
this.showToggle = this.schema.description ||
@@ -72,6 +80,13 @@ export default class JSONSchemaView {
7280
}
7381
});
7482
}
83+
84+
// Create a list of types as a string for Collections of types
85+
if(this.isCollectionOfTypes) {
86+
this.typeList = this.schema.type.reduce((prev, curr) => {
87+
return prev.type + ', ' + curr.type;
88+
});
89+
}
7590
}
7691

7792
/*
@@ -190,7 +205,7 @@ export default class JSONSchemaView {
190205
`}
191206
192207
<!-- Object -->
193-
${_if(!this.isPrimitive && !this.isArray && !this.isAny)`
208+
${_if(!this.isPrimitive && !this.isArray && !this.isAny && !this.isCollectionOfTypes)`
194209
<div class="object">
195210
<a class="title"><span
196211
class="toggle-handle"></span>${this.schema.title || ''} <span
@@ -218,6 +233,20 @@ export default class JSONSchemaView {
218233
`}
219234
</div>
220235
`}
236+
237+
<!-- Type Array -->
238+
${_if(this.isCollectionOfTypes)`
239+
<div class="collectionOfTypes">
240+
<a class="title"><span class="toggle-handle"></span>${this.schema.title || ''}</a>
241+
<span class="type">${this.typeList}</span>
242+
<div class="inner">
243+
${_if(this.schema.description && !this.isCollapsed)`
244+
<div class="description">${this.schema.description}</div>
245+
`}
246+
<!-- children go here -->
247+
</div>
248+
</div>
249+
`}
221250
`.replace(/\s*\n/g, '\n').replace(/(\<\!\-\-).+/g, '').trim();
222251
}
223252

@@ -312,6 +341,15 @@ export default class JSONSchemaView {
312341
inner.appendChild(view.render());
313342
}
314343

344+
if (this.isCollectionOfTypes) {
345+
const openLevel = this.open - 1;
346+
this.schema.type.forEach((type) => {
347+
const view = new JSONSchemaView(type, openLevel);
348+
inner.appendChild(view.render());
349+
});
350+
351+
}
352+
315353
if (typeof this.schema.properties === 'object') {
316354
Object.keys(this.schema.properties).forEach(propertyName => {
317355
const property = this.schema.properties[propertyName];

test/spec.js

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,32 @@ const schema = {
2727
]
2828
};
2929

30+
const v3Schema = {
31+
title: 'BloodType',
32+
type: [
33+
{
34+
type: 'object',
35+
title: 'BloodType',
36+
description: 'Blood type with structured group and RhD',
37+
properties: {
38+
group: {
39+
type: 'string',
40+
enum: ['A', 'B', 'AB', 'O']
41+
},
42+
'RhD': {
43+
type: 'string',
44+
enum: ['+', '-', 'Null']
45+
}
46+
}
47+
},
48+
{
49+
type: 'string',
50+
description: 'Blood type in a string',
51+
enum: ['A+', 'A-', 'O+', 'O-', 'AB+', 'AB-', 'A', 'B', 'AB', 'O']
52+
}
53+
]
54+
};
55+
3056
describe('rendering', ()=> {
3157
describe('blood type', ()=> {
3258
it('renders collapsed with 0 for open', ()=> {
@@ -45,4 +71,19 @@ describe('rendering', ()=> {
4571
expect(el.querySelector('.inner.oneOf').innerHTML.trim()).not.to.equal('');
4672
});
4773
});
74+
describe('blood type JSON Schema version 3', () => {
75+
it('renders multiple types inside type', () => {
76+
const view = new JSONSchemaView(v3Schema, 2);
77+
const el = view.render();
78+
79+
expect(el.querySelector('.type').innerHTML.trim()).to.equal('object, string');
80+
});
81+
82+
it('renders schemas inside collectionOfTypes', () => {
83+
const view = new JSONSchemaView(v3Schema, 2);
84+
const el = view.render();
85+
86+
expect(el.querySelectorAll('.collectionOfTypes .inner > .json-schema-view').length).to.equal(2);
87+
})
88+
});
4889
});

0 commit comments

Comments
 (0)