Broken on https://www.planttext.com/

[huyz]

It looks that this project is used on https://www.planttext.com/ but I'm not sure where to file an issue for the fact that the instance is broken (the reporting link is wrong).

When I try any conversion, I get:

Error parsing input file: 
/home/ubuntu/bin/PlantCode/Log/2019-17-3-11-34-07-typescript.txt
{ message: 'Expected [ \\t] or [A-Za-z_] but "-" found.',
  expected: 
   [ { type: 'class', value: '[ \\t]', description: '[ \\t]' },
     { type: 'class', value: '[A-Za-z_]', description: '[A-Za-z_]' } ],
  found: '-',
  location: 
   { start: { offset: 40, line: 4, column: 5 },
     end: { offset: 41, line: 4, column: 6 } },
  name: 'SyntaxError' }

[bafolts]

Can you provide an example of what is in your input file?

[huyz]

Oh actually, only some of the examples are broken.
If I take examples 3-6 under Class Diagrams at https://www.planttext.com/ and try to convert to Java, I get a similar error; examples 1-2 work.

Example 3:

@startuml

title Types - Class Diagram


skinparam componentStyle uml2

abstract class AbstractList {

}

class Test << general >> {
}

class System << (S,#FF7700) Singleton >>
class Date << (D,orchid) >>

class Foo1<Generics tag> {
  You can use
  several lines
  ..
  as you want
  and group
  ==
  things together.
  __
  You can have as many groups
  as you want
  --
  End of class
}

class User {
  .. Simple Getter ..
  + getName() : String
  + getAddress() : Address
  .. Some setter ..
  + setName() : String
  __ private data __
  -int age
  -- crypted --
  -String password
}

enum TimeUnit {
  DAYS
  HOURS
  MINUTES
}

interface List {

}

annotation SuppressWarnings

class Object << general >>
Object <|--- ArrayList

@enduml

[jean]

This creates a diagram, but the generator chokes:

@startuml

MemberCompany *-- DocumentFolder 
DocumentFolder *-- "*" Document
Region *-- City 
City "*" <-- MemberCompany
Contact "*" <-- MemberCompany

interface Address 
Address <|-- MemberCompany
Address <|-- Contact

@enduml

Error output:

Error parsing input file: 
/home/ubuntu/bin/PlantCode/Log/2019-10-7-10-24-00-coffeescript.txt
{ message: 'Expected "*", "--", "---", "-down-", "-left-", "-right-", "-up-", "..", "<|", "o", [ \\t], [-] or [.] but "<" found.',
  expected: 
   [ { type: 'literal', value: '*', description: '"*"' },
     { type: 'literal', value: '--', description: '"--"' },
     { type: 'literal', value: '---', description: '"---"' },
     { type: 'literal', value: '-down-', description: '"-down-"' },
     { type: 'literal', value: '-left-', description: '"-left-"' },
     { type: 'literal', value: '-right-', description: '"-right-"' },
     { type: 'literal', value: '-up-', description: '"-up-"' },
     { type: 'literal', value: '..', description: '".."' },
     { type: 'literal', value: '<|', description: '"<|"' },
     { type: 'literal', value: 'o', description: '"o"' },
     { type: 'class', value: '[ \\t]', description: '[ \\t]' },
     { type: 'class', value: '[-]', description: '[-]' },
     { type: 'class', value: '[.]', description: '[.]' } ],
  found: '<',
  location: 
   { start: { offset: 103, line: 6, column: 10 },
     end: { offset: 104, line: 6, column: 11 } },
  name: 'SyntaxError' }

[fuhrmanator]

I looked at the grammar, and I see it's not expecting the traditional UML format of a field with a <access> <name> : <type> but rather <access> <type> <name> as in Java. Many of the examples on PlantText.com use that traditional syntax, as does the highlighting of the very popular PlantUML extension in VSCode (albeit with regexes rather than with PEG.js).

Below is an example.

@startuml

class User {
-name : String
+getName() : String
}

@enduml

That example crashes the PEG.js here because obviously it's not expecting a ":" in fields.

As for the relationships between classes, it's complex (PlantUML is super flexible, since it tries to allow you to control how things are drawn as well as how things are related). I didn't grok the whole PEG.js grammar you defined yet, but I know PlantUML can state B is a subclass of A in at least in these ways (maybe more?):

1. B -|> A (make the line horizontal)
2. A <|- B
3. B --|> A (make the line vertical)
4. A <|-- B
5. class B extends A

When you consider associations, there are more cases.

A grammar to try to support all these would be (overly) complicated, at least for a start, and I think you've done right to be conservative.

If a format isn't supported, it's not a bug (but a limitation of the current grammar). I did a PEG.js grammar for GIFT format and automated the tests with Mocha/Chai. It might be useful to do that here.

I did a lot of hacking with the online PEG.js editor, which isn't smart enough to include require stuff, but I think you could write something like I did here to test with the compiled parser from the grammar. The left side would be the PlantUML code, and the right side would be a display of the intermediate (parsed) information.

If I can find some time, I would like to work on your project. It's something I've wanted to do for a while, and my students are using TypeScript and PlantUML in one of my courses.

[bafolts]

Somehow I lost track of this important issue. Thanks for bringing it back to my attention @fuhrmanator ! It does seem there are a few bugs with the current grammar. Including the optional colon character should be a straight forward fix. The relationship between classes will be more complex. I will focus on the addition of the optional colon first. I created this project as a proof of concept a few years back and since then PlantUML seems to be getting more popular. There was another issue filed at some point and I believe planttext.com is forced to run this tool server side to generate the output. Having a separate github page like yours would be a great addition. I have no association with the planttext.com tool but the author was kind enough to include me on their tool.