Left-navigation not highlighting correctly sometimes

[gayle]

I have some JSON documentation that was generated by the https://github.com/zipmark/rspec_api_documentation gem, and we are using the apitome gem to display the documentation.

I've noticed some of the left-navigation menu items don't highlight correctly. I am not 100% sure whether the problem is with the generation of the JSON or whether it's a problem with the display and the javascript highlighting the left nav and scrolling.

I have created a project in my own (non-work) github repo that's a subset of the work project, just enough to demonstrate the issues. I put that here https://github.com/gayle/api_docs

This is just a barebones generated rails app, where I added the apitome gem, and copied over the JSON files that were generated from my other project into the doc directory of this project. I didn't include the rspec test that generated them for the sake of simplicity, because I suspect it's a javascript problem not something with the JSON.

Here's what happens after I load the http://localhost:3000/api/docs page

When I click 'Certificate':

• The word 'Certificate' is not highlighted in the left-navigation.
• The section displayed in the middle is the Certificate section, but the word 'Certificate' in the main panel is not at the top, but rather 'Add' is at the top.
• The sub-sections of Certificate (Add, Renew, Replace, Revoke) don't show up in the left-navigation until I start scrolling down in the main panel. If I scroll back up, the sub-sections disappear from the left-nav.

When I click 'Application' that works as expected

When I click 'Request Status'

• all the sub-sections show up in the left-nav as expected. The first section "API Response Codes and Messages" is displayed in the main panel, but the menu item "API Response Codes and Messages" is not highlighted. Rather the one below it "Error1" is highlighted.
• if I click Error1, Error2, Error3, Error4, Success1, or Success2 those behave as expected
• if I click specifically on "API Response Codes and Messages" again the correct section shows up but it's not highlighted correctly on the left-nav
• if I scroll up in the main section such that "Request Status" is at the top of the page, then "API Response Codes and Messages" becomes highlighted in the left-nav.

One of the issues seems to be that certain menu items, when clicked, get an "active" class added to the DOM element, but others aren't correctly getting the "active" class added for some reason. I wanted to try to fix it myself and contribute to your project. But, wow, that's some complex Javascript. :) I'm impressed. But after adding lots of console.log statements I still couldn't figure out what's triggering 'active'. I'll still help out anyway I can, further troubleshooting or testing or whatever, if that's helpful. If you do see something wrong w/ the JSON itself let me know and I'll see what I can figure out about how it was generated.

[jsmartt]

Hi @gayle, I noticed in your test app Gemfile you are using the latest released version on RubyGems.org, but that is a bit behind the latest on the GitHub repo. Please try putting the following in your Gemfile and see if it fixes your issue:

gem 'apitome', git: 'https://github.com/jejacks0n/apitome.git', ref: '82fee54'

[gayle]

Thanks for your quick response. That is a great thought. I updated the version and pushed up the new Gemfile/Gemfile.lock.

That fixed most of the issues, thank you!

The one that's still not working right is "API Response Codes and Messages".

• When I click "Request Status" it now highlights "API Response Codes and Messages" as I would expect, which it didn't before.
• If I click on any of the Error or Success ones, those still work ok like they did before.
• But when I click back on "API Response Codes and Messages" it doesn't highlight (though it does show the correct section on the main panel)

I hope it's not that the name is too long?

Also I am not positive we'll be 'allowed' to use a version of a gem that's not out on RubyGems.org yet. (Company's kinda weird about those things). Any idea when the latest version will be released on RubyGems.org?

[jsmartt]

I'd love for it to be released soon as well. There's an open issue for that (#80), but I'm unaware of any timeline. And I totally understand company policies like that, even if it doesn't really make sense. Locking to a specific commit SHA is even more secure/deterministic than a version on RubyGems, as it is ensured to be constant. Any code change would produce a new SHA, but you can always yank and republish a tag or gem version.

As for your outstanding issues, perhaps someone else can jump in here?

[akhsunna]

Hey guys!

I had similar issue even with latest version of gem (0.2.0).

After investigation of the JS code I noticed that the problem in bootstrap's scrollspy.
It seems that it initializes variables too early (there's some logic with sections offsets, and offsets are somehow smaller than they are in the end).

So currently I've ended up with a small hack - I've added 1 second timeout before running scrollspy code, and that fixes the issue. I believe there must be some better solution, but I just don't know all the inner details, here's my commit for now: LinkUpStudio@64bde30

[FunkyloverOne]

@jsmartt could you take a look on that hack by @akhsunna ? It's actually helping me as well, maybe we should merge it or do something similar & better if possible in the main repo?

[jsmartt]

Has anyone tried moving the scrollspy initialization code down inside the $(document).ready(function() ? Similar to this example

[akhsunna]

Yes, it didn't help.