tweak

README.md

@@ -4,4 +4,4 @@ A powerful Vue SFC document generation tool
 
 ## Status
 
-[![build status](https://badgen.net/circleci/github/HcySunYang/vuese/master)](https://circleci.com/gh/HcySunYang/vuese/tree/master)
+[![build status](https://badgen.net/circleci/github/HcySunYang/vuese/master)](https://circleci.com/gh/HcySunYang/vuese/tree/master)

__fixtures__/all.vue

@@ -0,0 +1,35 @@
+<template>
+  <div>
+    <!-- 表单头部 -->
+    <slot name="header">
+      <!-- `<th>title</th>` -->
+      <th>title</th>
+    </slot>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    // 表单的名称，最多8个字符
+    name: {
+      type: [String, Number],
+      required: true,
+      validator () {}
+    }
+  },
+  methods: {
+    // @vuese
+    // 用来手动清空表单
+    clear () {
+      // 清空表单时触发
+      // @arg 参数是一个布尔值，代表xxx
+      this.$emit('onclear', true)
+    }
+  }
+}
+</script>
+
+<style>
+
+</style>

src/__test__/__snapshots__/index.test.ts.snap

@@ -0,0 +1,21 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`The generated document matches the expected results 1`] = `
+"|Name|Description|Type|Required|Default|
+|---|---|---|---|---|
+|name|表单的名称，最多8个字符|\`String\` / \`Number\`|\`true\`|-|
+
+|Event Name|Description|Parameters|
+|---|---|---|
+|onclear|清空表单时触发| 参数是一个布尔值，代表xxx|
+
+|Name|Description|Default Slot Content|
+|---|---|---|
+|header|表单头部|\`<th>title</th>\`|
+
+|Method|Description|Parameters|
+|---|---|---|
+|clear|用来手动清空表单| 参数是一个布尔值，代表xxx|
+
+"
+`;

src/__test__/index.test.ts

@@ -0,0 +1,14 @@
+import vuese from '../index'
+import * as path from 'path'
+import * as fs from 'fs'
+
+function getSource(fileName: string): string {
+  const p = path.resolve(__dirname, `../../__fixtures__/${fileName}`)
+  const source = fs.readFileSync(p, 'utf-8')
+  return source
+}
+
+test('The generated document matches the expected results', () => {
+  const source = getSource('all.vue')
+  expect(vuese(source)).toMatchSnapshot()
+})

src/index.ts

@@ -0,0 +1,23 @@
+import parser, { ParserResult } from './parser'
+import Render, { RenderResult } from './render'
+
+export default function(source: string): string {
+  const pr: ParserResult = parser(source)
+  const r = new Render(pr)
+  const renderRes: RenderResult = r.render()
+  let mdString = ''
+  if (renderRes.props) {
+    mdString += renderRes.props + '\n'
+  }
+  if (renderRes.events) {
+    mdString += renderRes.events + '\n'
+  }
+  if (renderRes.slots) {
+    mdString += renderRes.slots + '\n'
+  }
+  if (renderRes.methods) {
+    mdString += renderRes.methods + '\n'
+  }
+
+  return mdString
+}

src/render/__test__/__snapshots__/index.test.ts.snap

@@ -3,19 +3,19 @@
 exports[`Proper rendering of the table header 1`] = `
 Object {
   "events": "|Event Name|Description|Parameters|
-====================================
+|---|---|---|
 |click|Triggered when clicked|a boolean value|
 ",
   "methods": "|Method|Description|Parameters|
-================================
+|---|---|---|
 |clear|Clear form|a boolean value|
 ",
   "props": "|Name|Description|Type|Required|Default|
-=========================================
+|---|---|---|---|---|
 |someProp|Represents the direction of the arrow|\`TOP\` / \`BOTTOM\`|\`true\`|\`TOP\`|
 ",
   "slots": "|Name|Description|Default Slot Content|
-========================================
+|---|---|---|
 |header|Table header|\`<th>{{title}}</th>\`|
 ",
 }

src/render/__test__/index.test.ts

@@ -1,5 +1,6 @@
 import Render, { RenderResult } from '../index'
 import { ParserResult } from '../../parser'
+
 test('Proper rendering of the table header', () => {
   const res: ParserResult = {
     props: [

src/render/index.ts

@@ -80,7 +80,7 @@ export default class Render {
           } else if (Array.isArray(prop.type)) {
             row.push(
               prop.type
-                .map(t => `\`${t}\` | `)
+                .map(t => `\`${t}\` / `)
                 .join('')
                 .slice(0, -3)
             )
@@ -205,7 +205,7 @@ export default class Render {
 
   renderTabelHeader(header: string[]): string {
     const headerString = this.renderTabelRow(header)
-    const splitLine = this.renderSplitLine(headerString.length)
+    const splitLine = this.renderSplitLine(header.length)
     return headerString + splitLine + '\n'
   }
 
@@ -216,8 +216,8 @@ export default class Render {
   renderSplitLine(num: number): string {
     let line = ''
     for (let i = 0; i < num; i++) {
-      line += '='
+      line += '|---'
     }
-    return line
+    return line + '|'
   }
 }