Skip to content

Commit d810412

Browse files
KocalKocal
authored
fix(renderers): types with < and > were rendered as HTML (#85)
`Array.<String>` was visually rendered as `Array.`, because `<String>` was interpreted as an HTML tag. Fix #84
1 parent 1af9779 commit d810412

File tree

12 files changed

+110
-25
lines changed

12 files changed

+110
-25
lines changed

‎cypress/integration/renderers/default.spec.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -97,11 +97,11 @@ describe('Renderers: default', () => {
9797
expect($rows).to.have.length(3);
9898

9999
expect($firstRowChildren.eq(0).html()).to.eq('<b>fooList</b>');
100-
expect($firstRowChildren.eq(1).html()).to.eq('Array');
100+
expect($firstRowChildren.eq(1).html()).to.eq('Array.&lt;String&gt;');
101101
expect($firstRowChildren.eq(2).html()).to.eq('A list of foo');
102102

103103
expect($secondRowChildren.eq(0).html()).to.eq('<b>barList</b>');
104-
expect($secondRowChildren.eq(1).html()).to.eq('Array');
104+
expect($secondRowChildren.eq(1).html()).to.eq('Array.&lt;String&gt;');
105105
expect($secondRowChildren.eq(2).html()).to.eq('A list of bar');
106106

107107
expect($thirdRowChildren.eq(0).html()).to.eq('<b>message</b>');

‎cypress/integration/renderers/docstrap.spec.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -97,11 +97,11 @@ describe('Renderers: docstrap', () => {
9797
expect($rows).to.have.length(3);
9898

9999
expect($firstRowChildren.eq(0).html()).to.eq('<b>fooList</b>');
100-
expect($firstRowChildren.eq(1).html()).to.eq('Array');
100+
expect($firstRowChildren.eq(1).html()).to.eq('Array.&lt;String&gt;');
101101
expect($firstRowChildren.eq(2).html()).to.eq('A list of foo');
102102

103103
expect($secondRowChildren.eq(0).html()).to.eq('<b>barList</b>');
104-
expect($secondRowChildren.eq(1).html()).to.eq('Array');
104+
expect($secondRowChildren.eq(1).html()).to.eq('Array.&lt;String&gt;');
105105
expect($secondRowChildren.eq(2).html()).to.eq('A list of bar');
106106

107107
expect($thirdRowChildren.eq(0).html()).to.eq('<b>message</b>');

‎cypress/integration/renderers/minami.spec.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -101,12 +101,12 @@ describe('Renderers: minami', () => {
101101

102102
expect($firstRowChildren.eq(0).html()).to.eq('fooList');
103103
expect($firstRowChildren.eq(0).attr('class')).to.eq('name');
104-
expect($firstRowChildren.eq(1).html()).to.eq('Array');
104+
expect($firstRowChildren.eq(1).html()).to.eq('Array.&lt;String&gt;');
105105
expect($firstRowChildren.eq(2).html()).to.eq('A list of foo');
106106

107107
expect($secondRowChildren.eq(0).html()).to.eq('barList');
108108
expect($secondRowChildren.eq(0).attr('class')).to.eq('name');
109-
expect($secondRowChildren.eq(1).html()).to.eq('Array');
109+
expect($secondRowChildren.eq(1).html()).to.eq('Array.&lt;String&gt;');
110110
expect($secondRowChildren.eq(2).html()).to.eq('A list of bar');
111111

112112
expect($thirdRowChildren.eq(0).html()).to.eq('message');

‎cypress/integration/renderers/tui.spec.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -97,11 +97,11 @@ describe('Renderers: tui', () => {
9797
expect($rows).to.have.length(3);
9898

9999
expect($firstRowChildren.eq(0).html()).to.eq('<b>fooList</b>');
100-
expect($firstRowChildren.eq(1).html()).to.eq('Array');
100+
expect($firstRowChildren.eq(1).html()).to.eq('Array.&lt;String&gt;');
101101
expect($firstRowChildren.eq(2).html()).to.eq('A list of foo');
102102

103103
expect($secondRowChildren.eq(0).html()).to.eq('<b>barList</b>');
104-
expect($secondRowChildren.eq(1).html()).to.eq('Array');
104+
expect($secondRowChildren.eq(1).html()).to.eq('Array.&lt;String&gt;');
105105
expect($secondRowChildren.eq(2).html()).to.eq('A list of bar');
106106

107107
expect($thirdRowChildren.eq(0).html()).to.eq('<b>message</b>');

‎example/src/BetterCounter.vue‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,8 +14,8 @@
1414
* @vue-prop {Number} initialCounter
1515
* @vue-prop {Number} [step=1] Step
1616
* @vue-data {Number} counter - Current counter's value
17-
* @vue-computed {Array} fooList - A list of foo
18-
* @vue-computed {Array} barList - A list of bar
17+
* @vue-computed {Array.<String>} fooList - A list of foo
18+
* @vue-computed {Array.<String>} barList - A list of bar
1919
* @vue-computed {String} message A message
2020
*/
2121
export default {

‎lib/renderers/default.js‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
const makeTableHead = headers => `<thead><th>${headers.join('</th><th>')}</th></thead>`;
22
const makeTableBody = (items, cb) => `<tbody>${items.map(item => `<tr>${cb(item).trim()}</tr>`).join('')}</tbody>`;
3+
const renderTypes = require('./utils/renderTypes');
34

45
module.exports = function renderDefault(description, props = [], data = [], computed = []) {
56
let html = description;
@@ -15,7 +16,7 @@ module.exports = function renderDefault(description, props = [], data = [], comp
1516
html += makeTableHead(['Name', 'Type', 'Default value', 'Required ?', 'Description']);
1617
html += makeTableBody(props, item => `
1718
<td><b>${item.name}</b></td>
18-
<td>${(item.type.names || []).join(', ')}</td>
19+
<td>${renderTypes(item.type.names || [])}</td>
1920
<td>${typeof item.defaultvalue === 'undefined' ? '-' : `<code>${item.defaultvalue}</code>`}</td>
2021
<td>${item.optional ? 'No' : '<b>Yes</b>'}</td>
2122
<td>${typeof item.description === 'undefined' ? '-' : item.description}</td>
@@ -29,7 +30,7 @@ module.exports = function renderDefault(description, props = [], data = [], comp
2930
html += makeTableHead(['Name', 'Type', 'Default value', 'Description']);
3031
html += makeTableBody(data, item => `
3132
<td><b>${item.name}</b></td>
32-
<td>${(item.type.names || []).join(', ')}</td>
33+
<td>${renderTypes(item.type.names || [])}</td>
3334
<td>${typeof item.defaultvalue === 'undefined' ? '-' : `<code>${item.defaultvalue}</code>`}</td>
3435
<td>${typeof item.description === 'undefined' ? '-' : item.description}</td>
3536
`);
@@ -42,7 +43,7 @@ module.exports = function renderDefault(description, props = [], data = [], comp
4243
html += makeTableHead(['Name', 'Type', 'Description']);
4344
html += makeTableBody(computed, item => `
4445
<td><b>${item.name}</b></td>
45-
<td>${(item.type.names || []).join(', ')}</td>
46+
<td>${renderTypes(item.type.names || [])}</td>
4647
<td>${typeof item.description === 'undefined' ? '-' : item.description}</td>
4748
`);
4849
html += '</table>';

‎lib/renderers/docstrap.js‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
const makeTableHead = headers => `<thead><th>${headers.join('</th><th>')}</th></thead>`;
22
const makeTableBody = (items, cb) => `<tbody>${items.map(item => `<tr>${cb(item).trim()}</tr>`).join('')}</tbody>`;
3+
const renderTypes = require('./utils/renderTypes');
34

45
module.exports = function renderDocstrap(description, props = [], data = [], computed = []) {
56
let html = description;
@@ -16,7 +17,7 @@ module.exports = function renderDocstrap(description, props = [], data = [], com
1617
html += makeTableHead(['Name', 'Type', 'Default value', 'Required ?', 'Description']);
1718
html += makeTableBody(props, item => `
1819
<td><b>${item.name}</b></td>
19-
<td>${(item.type.names || []).join(', ')}</td>
20+
<td>${renderTypes(item.type.names || [])}</td>
2021
<td>${typeof item.defaultvalue === 'undefined' ? '-' : `<code>${item.defaultvalue}</code>`}</td>
2122
<td>${item.optional ? 'No' : '<b>Yes</b>'}</td>
2223
<td>${typeof item.description === 'undefined' ? '-' : item.description}</td>
@@ -31,7 +32,7 @@ module.exports = function renderDocstrap(description, props = [], data = [], com
3132
html += makeTableHead(['Name', 'Type', 'Default value', 'Description']);
3233
html += makeTableBody(data, item => `
3334
<td><b>${item.name}</b></td>
34-
<td>${(item.type.names || []).join(', ')}</td>
35+
<td>${renderTypes(item.type.names || [])}</td>
3536
<td>${typeof item.defaultvalue === 'undefined' ? '-' : `<code>${item.defaultvalue}</code>`}</td>
3637
<td>${typeof item.description === 'undefined' ? '-' : item.description}</td>
3738
`);
@@ -45,7 +46,7 @@ module.exports = function renderDocstrap(description, props = [], data = [], com
4546
html += makeTableHead(['Name', 'Type', 'Description']);
4647
html += makeTableBody(computed, item => `
4748
<td><b>${item.name}</b></td>
48-
<td>${(item.type.names || []).join(', ')}</td>
49+
<td>${renderTypes(item.type.names || [])}</td>
4950
<td>${typeof item.description === 'undefined' ? '-' : item.description}</td>
5051
`);
5152
html += '</table>';

‎lib/renderers/minami.js‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
const makeTableHead = headers => `<thead><th>${headers.join('</th><th>')}</th></thead>`;
22
const makeTableBody = (items, cb) => `<tbody>${items.map(item => `<tr>${cb(item).trim()}</tr>`).join('')}</tbody>`;
3+
const renderTypes = require('./utils/renderTypes');
34

45
module.exports = function renderMinami(description, props = [], data = [], computed = []) {
56
let html = description;
@@ -12,7 +13,7 @@ module.exports = function renderMinami(description, props = [], data = [], compu
1213
html += makeTableHead(['Name', 'Type', 'Default value', 'Required ?', 'Description']);
1314
html += makeTableBody(props, item => `
1415
<td class="name">${item.name}</td>
15-
<td>${(item.type.names || []).join(', ')}</td>
16+
<td>${renderTypes(item.type.names || [])}</td>
1617
<td>${typeof item.defaultvalue === 'undefined' ? '-' : `<code>${item.defaultvalue}</code>`}</td>
1718
<td>${item.optional ? 'No' : '<b>Yes</b>'}</td>
1819
<td>${typeof item.description === 'undefined' ? '-' : item.description}</td>
@@ -26,7 +27,7 @@ module.exports = function renderMinami(description, props = [], data = [], compu
2627
html += makeTableHead(['Name', 'Type', 'Default value', 'Description']);
2728
html += makeTableBody(data, item => `
2829
<td class="name">${item.name}</td>
29-
<td>${(item.type.names || []).join(', ')}</td>
30+
<td>${renderTypes(item.type.names || [])}</td>
3031
<td>${typeof item.defaultvalue === 'undefined' ? '-' : `<code>${item.defaultvalue}</code>`}</td>
3132
<td>${typeof item.description === 'undefined' ? '-' : item.description}</td>
3233
`);
@@ -39,7 +40,7 @@ module.exports = function renderMinami(description, props = [], data = [], compu
3940
html += makeTableHead(['Name', 'Type', 'Description']);
4041
html += makeTableBody(computed, item => `
4142
<td class="name">${item.name}</td>
42-
<td>${(item.type.names || []).join(', ')}</td>
43+
<td>${renderTypes(item.type.names || [])}</td>
4344
<td>${typeof item.description === 'undefined' ? '-' : item.description}</td>
4445
`);
4546
html += '</table>';

‎lib/renderers/tui.js‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
const makeTableHead = headers => `<thead><th class="tui-grid-cell-head">${headers.join('</th><th class="tui-grid-cell-head">')}</th></thead>`;
22
const makeTableBody = (items, cb) => `<tbody>${items.map(item => `<tr>${cb(item).trim()}</tr>`).join('')}</tbody>`;
3+
const renderTypes = require('./utils/renderTypes');
34

45
module.exports = function renderTui(description, props = [], data = [], computed = []) {
56
let html = description;
@@ -36,7 +37,7 @@ module.exports = function renderTui(description, props = [], data = [], computed
3637
html += makeTableHead(['Name', 'Type', 'Default value', 'Required ?', 'Description']);
3738
html += makeTableBody(props, item => `
3839
<td class="tui-grid-cell"><b>${item.name}</b></td>
39-
<td class="tui-grid-cell">${(item.type.names || []).join(', ')}</td>
40+
<td class="tui-grid-cell">${renderTypes(item.type.names || [])}</td>
4041
<td class="tui-grid-cell">${typeof item.defaultvalue === 'undefined' ? '-' : `<code>${item.defaultvalue}</code>`}</td>
4142
<td class="tui-grid-cell">${item.optional ? 'No' : '<b>Yes</b>'}</td>
4243
<td class="tui-grid-cell">${typeof item.description === 'undefined' ? '-' : item.description}</td>
@@ -50,7 +51,7 @@ module.exports = function renderTui(description, props = [], data = [], computed
5051
html += makeTableHead(['Name', 'Type', 'Default value', 'Description']);
5152
html += makeTableBody(data, item => `
5253
<td class="tui-grid-cell"><b>${item.name}</b></td>
53-
<td class="tui-grid-cell">${(item.type.names || []).join(', ')}</td>
54+
<td class="tui-grid-cell">${renderTypes(item.type.names || [])}</td>
5455
<td class="tui-grid-cell">${typeof item.defaultvalue === 'undefined' ? '-' : `<code>${item.defaultvalue}</code>`}</td>
5556
<td class="tui-grid-cell">${typeof item.description === 'undefined' ? '-' : item.description}</td>
5657
`);
@@ -63,7 +64,7 @@ module.exports = function renderTui(description, props = [], data = [], computed
6364
html += makeTableHead(['Name', 'Type', 'Description']);
6465
html += makeTableBody(computed, item => `
6566
<td class="tui-grid-cell"><b>${item.name}</b></td>
66-
<td class="tui-grid-cell">${(item.type.names || []).join(', ')}</td>
67+
<td class="tui-grid-cell">${renderTypes(item.type.names || [])}</td>
6768
<td class="tui-grid-cell">${typeof item.description === 'undefined' ? '-' : item.description}</td>
6869
`);
6970
html += '</table>';

‎lib/renderers/utils/renderTypes.js‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
const { htmlsafe } = require('jsdoc/lib/jsdoc/util/templateHelper');
2+
3+
module.exports = function renderTypes(types) {
4+
return types.map(htmlsafe).join('|');
5+
};

0 commit comments

Comments
 (0)