danielgtaylor / aglio

An API Blueprint renderer with theme support that outputs static HTML
4.75k stars 480 forks source link

chopping off last chars in line and adding to next line... #127

Open sheshmantha opened 9 years ago

sheshmantha commented 9 years ago

Hi, I've just loaded (#newbie) node.js, protagonist and aglio (all downloaded today). I'm using the example.apib included here and run it using flatly as in aglio -t flatly -i example.apib -s. I do get some warnings on Transformer.coffee -- snip --

Server started on http://127.0.0.1:3000/
Rendering example.apib
Transformers.coffee is deprecated, you must replace the :coffee jade filter, with :coffee-script and install jstransform
er-coffee-script before you update to jade@2.0.0.
Transformers.stylus is deprecated, to continue using the :stylus jade filter after jade@2.0.0, you will need to install
jstransformer-stylus.

Going to local host port 3000 renders the HTML but somehow the last 2 chars on every line gets "chopped off" and place on the following line. For instance see the following clip: image

Notice that the "le" in "subtitle" is chopped off and placed on line below.

I did get some type errors when aglio was built particularly with declarations of 'v8::String' from v8.h... not sure if I need to fix that. If so, how?

Else, how to debug this ? Please advise.

Thanks, S-

BTW: I love this tool -- Thank you !!! bow

danielgtaylor commented 9 years ago

@sheshmantha that's very strange. Can you try the latest beta and see if it is still an issue? Use npm install -g aglio@beta to install. If it's still a problem, please let me know some more info about your setup: what operating system, browser, etc are you using?

sheshmantha commented 9 years ago

Hi Daniel, Thanks for reply... I installed the beta rev as you suggested and tried it on Chrome, IE and Firefox. Still get the same problem.

OS: Windows Enterprise 7 64bit Chrome: 43.0.2357.132 m IE: 11.0.9600.17801 firefox: 37.0.2

C:\protagonist\node_modules\protagonist>npm list protagonist@0.20.1 C:\protagonist\node_modules\protagonist ├── async@0.2.10 ├─┬ chai@1.9.2 │ ├── assertion-error@1.0.0 │ └─┬ deep-eql@0.1.3 │ └── type-detect@0.1.1 ├── coffee-script@1.6.3 ├─┬ mocha@1.17.1 │ ├── commander@2.0.0 │ ├─┬ debug@2.2.0 │ │ └── ms@0.7.1 │ ├── diff@1.0.7 │ ├─┬ glob@3.2.3 │ │ ├── graceful-fs@2.0.3 │ │ ├── inherits@2.0.1 │ │ └─┬ minimatch@0.2.14 │ │ ├── lru-cache@2.6.5 │ │ └── sigmund@1.0.1 │ ├── growl@1.7.0 │ ├─┬ jade@0.26.3 │ │ ├── commander@0.6.1 │ │ └── mkdirp@0.3.0 │ └── mkdirp@0.3.5 └── nan@1.8.4

Thanks, S-

danielgtaylor commented 9 years ago

@sheshmantha I've tried Windows 7 and Windows 10 with Internet Explorer 10 and 11 and can't seem to reproduce this.

screen shot 2015-07-15 at 10 30 21

The fact that it happens on all the browsers makes me think maybe it's a font issue or something, but I'm really grasping at straws now. What language is your computer? Can you reproduce this on any other machine? Does this display the same issue:

http://htmlpreview.github.io/?https://raw.githubusercontent.com/danielgtaylor/aglio/blob/master/examples/flatly.html

Do any other websites exhibit this problem?

sheshmantha commented 9 years ago

ah! that URL you sent works. The API looks good on the browsers.

I do have Hindi and English configured on my windows system... one curious thing with installation of node-gyp on Windows (required of Protagonist), the Windows 7 SDK didn't fully install ( http://www.microsoft.com/en-us/download/details.aspx?id=8279) -- maybe that's the issue?

I"ve not tried it on another system - but will do that later today...

Thanks for your "hand-holding".

s-

On Wed, Jul 15, 2015 at 4:33 AM, Daniel G. Taylor notifications@github.com wrote:

@sheshmantha https://github.com/sheshmantha I've tried Windows 7 and Windows 10 with Internet Explorer 10 and 11 and can't seem to reproduce this. The fact that it happens on all the browsers makes me think maybe it's a font issue or something, but I'm really grasping at straws now. What language is your computer? Can you reproduce this on any other machine? Does this display the same issue:

http://htmlpreview.github.io/?https://raw.githubusercontent.com/danielgtaylor/aglio/blob/master/examples/flatly.html

Do any other websites exhibit this problem?

— Reply to this email directly or view it on GitHub https://github.com/danielgtaylor/aglio/issues/127#issuecomment-121529063 .

sheshmantha commented 9 years ago

@danielgtaylor -- I've installed on a clean Windows machine and all is well with the matrix! Thank you image

danielgtaylor commented 9 years ago

@sheshmantha glad to hear you got it working :smile:

onatm commented 9 years ago

The problem still remains. Tried on both Windows 8.1 en-us and Mac OSX 10.10.4 en-us.

aglio is installed with npm install -g aglio

html output is produced with aglio -i documentation.apib -o index.html

and this is the output:

capture

danielgtaylor commented 9 years ago

@onatm does the HTML itself contain the break/newline or is this a styling (CSS) issue? Do you mind pasting the relevant HTML snippet? What happens when you hover over the header? Do you get the permalink fading in to the right of the o? Anything else you can tell me to try and help debug this?

onatm commented 9 years ago

@danielgtaylor, it seems there is no problem with styling. When i hover over i can get permalink in to the right of p tag.

For further debugging, related html is as follows:

<h2 id="header-authenticatio">Authenticatio <a class="permalink" href="#header-authenticatio" aria-hidden="true">¶</a></h2>
<p>n</p>
<p>API is protected by HTTP Basic Authentication, hence the client should send the username and the password in HTTP Authorization header</p>
<p>.</p>

and also related markdown:

## Authentication

API is protected by HTTP Basic Authentication, hence the client should send the username and the password in HTTP Authorization header.
danielgtaylor commented 9 years ago

@onatm thanks this is really helpful. It does look like a bug. Can you let me know the version of Node you are using and the output of npm list -g markdown-it markdown-it-anchor protagonist? You should see something like:

├─┬ aglio@2.0.0
│ └─┬ aglio-theme-olio@1.0.0
│   ├── markdown-it@4.4.0 
│   └── markdown-it-anchor@2.2.0 
│ └─┬ drafter@0.2.8
│   └── protagonist@0.20.1

This might help me to reproduce the issue on my end.

Edit: I've just tried with the package versions above on Node 0.10.39 and 0.12.7 as well as iojs 2.4.0 and cannot reproduce this issue.

onatm commented 9 years ago

@danielgtaylor the output for npm list -g markdown-it markdown-it-anchor protagonist is as follows:

└─┬ aglio@2.0.0
  ├─┬ aglio-theme-olio@1.0.0
  │ ├── markdown-it@4.4.0
  │ └── markdown-it-anchor@2.2.0
  └─┬ drafter@0.2.8
    └── protagonist@0.20.1

node version is: v0.12.5

ghost commented 8 years ago

I just ran ~/node_modules/apib2swagger/bin/apib2swagger.js that uses drafter parser and got the same exact issue, so the problem is in the way the code parses the apiblieprint.

pomber commented 8 years ago

I think this issue is related to the file encoding (at least for me). I have two files with same markdown and different encoding, one fails and the other doesn't. Can I upload attach files to the issue?

danielgtaylor commented 8 years ago

@pomber that would be fantastic. Either upload them here or on something like Dropbox and give us the link! What are the file encodings that are not working?

pomber commented 8 years ago

According to Notepad++, one file has encoding UTF8 and the other UTF8 without BOM. In my case, I think the enccoding was changed by Visual Studio 2012.

danielgtaylor commented 8 years ago

@pomber this is useful thanks. Aglio is assuming utf8 input - so maybe this is part of the issue. I'm not sure what needs to be done to fix it, but I can try some samples. Any idea how to generate a file with and without the BOM?

pomber commented 8 years ago

@danielgtaylor I uploaded the two files here http://dropcanvas.com/0tx1g