Merge pull request #474 from vue-styleguidist/fix-extendtsas

Fix: resolve typescript component that extend as VueCosntructor
vue-styleguidist · Jun 27, 2019 · e93a805 · e93a805
2 parents c19dbf8 + f41869d
commit e93a805
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 6 deletions.
diff --git a/packages/vue-docgen-api/src/utils/__tests__/resolveExportedComponent.ts b/packages/vue-docgen-api/src/utils/__tests__/resolveExportedComponent.ts
@@ -55,4 +55,18 @@ describe('resolveExportedComponent', () => {
  )
  expect(resolveExportedComponent(ast).size).toBe(1)
  })
+
+ it('should return exported typescript extend style components', () => {
+ const ast = babylon({ plugins: ['typescript'] }).parse(
+ ['export default Vue.extend({})'].join('\n')
+ )
+ expect(resolveExportedComponent(ast).size).toBe(1)
+ })
+
+ it('should return exported typescript extend custom VueConstructor', () => {
+ const ast = babylon({ plugins: ['typescript'] }).parse(
+ ['export default (Vue as VueConstructor<Vue & SomeInterface>).extend({})'].join('\n')
+ )
+ expect(resolveExportedComponent(ast).size).toBe(1)
+ })
 })
diff --git a/packages/vue-docgen-api/src/utils/resolveExportedComponent.ts b/packages/vue-docgen-api/src/utils/resolveExportedComponent.ts
@@ -18,12 +18,15 @@ function isComponentDefinition(path: NodePath): boolean {
  (bt.isVariableDeclarator(path.node) &&
  path.node.init &&
  bt.isObjectExpression(path.node.init)) ||
- // export default Vue.extends({})
+ // export default Vue.extend({})
  (bt.isCallExpression(path.node) &&
  bt.isMemberExpression(path.node.callee) &&
- bt.isIdentifier(path.node.callee.object) &&
- path.node.callee.object.name === 'Vue' &&
- path.node.callee.property.name === 'extend') ||
+ path.node.callee.property.name === 'extend' &&
+ ((bt.isIdentifier(path.node.callee.object) && path.node.callee.object.name === 'Vue') ||
+ // or export default (Vue as VueConstructor<Vue>).extend({})
+ (bt.isTSAsExpression(path.node.callee.object) &&
+ bt.isIdentifier(path.node.callee.object.expression) &&
+ path.node.callee.object.expression.name === 'Vue'))) ||
  // export default class MyComp extends VueComp
  bt.isClassDeclaration(path.node)
  )

diff --git a/packages/vue-styleguidist/src/rsg-components/Props/PropsRenderer.js b/packages/vue-styleguidist/src/rsg-components/Props/PropsRenderer.js
@@ -101,7 +101,7 @@ function renderShape(props) {
  return rows
 }
 
-const defaultValueBlacklist = ['null', 'undefined']
+const defaultValueBlacklist = ['null', 'undefined', "''", '""']
 
 function renderDefault(prop) {
  // Workaround for issue https://github.com/reactjs/react-docgen/issues/221
@@ -111,7 +111,7 @@ function renderDefault(prop) {
  const propName = prop.type.name
 
  if (defaultValueBlacklist.indexOf(prop.defaultValue.value) > -1) {
- return <Code>{showSpaces(unquote(prop.defaultValue.value))}</Code>
+ return <Code>{prop.defaultValue.value}</Code>
  } else if (propName === 'func' || propName === 'function') {
  return (
  <Text