Including with Turbolinks breaks Turbolinks page refresh about pace HOT 20 CLOSED

I would love to know what the actual error is. My best guess is that document.body doesn't exist for a time, but that doesn't make very much sense.

from pace.

Unfortunately that's all I get to see :(

from pace.

Can you switch to the unminifed pace real quick, so we can get real line numbers? I appreciate you help in getting to the bottom of this.

from pace.

Pretty sure I wasn't using the unminified one ... and Rails isn't
compressing in Dev ... but Ill go reintroduce it and see if I get mnore info

On Thu, Oct 24, 2013 at 11:01 AM, Zack Bloom [email protected]:

Can you switch to the unminifed pace real quick, so we can get real line
numbers? I appreciate you help in getting to the bottom of this.

—
Reply to this email directly or view it on GitHubhttps://github.com//issues/47#issuecomment-26956743
.

from pace.

I only think so because all of the errors in the pace file are on the same line.

from pace.

1. Uncaught Error
   pace.js?body=1:141http://www.lvh.me:3000/assets/libs/pace.js?body=1
   1. NoTargetErrorpace.js?body=1:141http://www.lvh.me:3000/assets/libs/pace.js?body=1
   2. Bar.getElementpace.js?body=1:159http://www.lvh.me:3000/assets/libs/pace.js?body=1
   3. Bar.destroypace.js?body=1:190http://www.lvh.me:3000/assets/libs/pace.js?body=1
   4. Pace.stoppace.js?body=1:670http://www.lvh.me:3000/assets/libs/pace.js?body=1
   5. Pace.restartpace.js?body=1:682http://www.lvh.me:3000/assets/libs/pace.js?body=1
   6. handlePushStatepace.js?body=1:621http://www.lvh.me:3000/assets/libs/pace.js?body=1
   7. window.history.replaceStatepace.js?body=1:636http://www.lvh.me:3000/assets/libs/pace.js?body=1
   8. rememberCurrentUrlturbolinks.js?body=1:167http://www.lvh.me:3000/assets/turbolinks.js?body=1
   9. initializeTurbolinksturbolinks.js?body=1:381http://www.lvh.me:3000/assets/turbolinks.js?body=1
   10. (anonymous
       function)turbolinks.js?body=1:410http://www.lvh.me:3000/assets/turbolinks.js?body=1
   11. (anonymous
       function)turbolinks.js?body=1:422http://www.lvh.me:3000/assets/turbolinks.js?body=1

On Thu, Oct 24, 2013 at 11:07 AM, Zack Bloom [email protected]:

I only think so because all of the errors in the pace file are on the same
line.

—
Reply to this email directly or view it on GitHubhttps://github.com//issues/47#issuecomment-26957007
.

from pace.

If it is due to no 'body' tag, then perhaps Pace should wait for document
ready as per JQuery?

On Thu, Oct 24, 2013 at 11:09 AM, Jak Charlton [email protected]:

1. Uncaught Error pace.js?body=1:141http://www.lvh.me:3000/assets/libs/pace.js?body=1
   1. NoTargetErrorpace.js?body=1:141http://www.lvh.me:3000/assets/libs/pace.js?body=1
   2. Bar.getElementpace.js?body=1:159http://www.lvh.me:3000/assets/libs/pace.js?body=1
   3. Bar.destroypace.js?body=1:190http://www.lvh.me:3000/assets/libs/pace.js?body=1
   4. Pace.stoppace.js?body=1:670http://www.lvh.me:3000/assets/libs/pace.js?body=1
   5. Pace.restartpace.js?body=1:682http://www.lvh.me:3000/assets/libs/pace.js?body=1
   6. handlePushStatepace.js?body=1:621http://www.lvh.me:3000/assets/libs/pace.js?body=1
   7. window.history.replaceStatepace.js?body=1:636http://www.lvh.me:3000/assets/libs/pace.js?body=1
   8. rememberCurrentUrlturbolinks.js?body=1:167http://www.lvh.me:3000/assets/turbolinks.js?body=1
   9. initializeTurbolinksturbolinks.js?body=1:381http://www.lvh.me:3000/assets/turbolinks.js?body=1
   10. (anonymous function)turbolinks.js?body=1:410http://www.lvh.me:3000/assets/turbolinks.js?body=1
   11. (anonymous function)turbolinks.js?body=1:422http://www.lvh.me:3000/assets/turbolinks.js?body=1

On Thu, Oct 24, 2013 at 11:07 AM, Zack Bloom [email protected]:

I only think so because all of the errors in the pace file are on the
same line.

—
Reply to this email directly or view it on GitHubhttps://github.com//issues/47#issuecomment-26957007
.

from pace.

Pace is meant to be shown during the loading process, so waiting for document.ready would cause it to miss half of it.

Yep, so what it's saying is that the target is not ready when pace tries to initialize. The target by default is the 'body' element, have set the 'target' option by any chance?

from pace.

I have just dropped it in with no settings ... are you suggesting using
another element? None would be present if body wasn't, other than HTML and
HEAD and I'm guessing it wouldn't be able to display then :)

You could wait for document body when it was an XHR call rather than a page
reload?

On Thu, Oct 24, 2013 at 11:32 AM, Zack Bloom [email protected]:

Pace is meant to be shown during the loading process, so waiting for
document.ready would cause it to miss half of it.

Yep, so what it's saying is that the target is not ready when pace tries
to initialize. The target by default is the 'body' element, have set the
'target' option by any chance?

—
Reply to this email directly or view it on GitHubhttps://github.com//issues/47#issuecomment-26958164
.

from pace.

I had to dive into the turbolinks code a bit, it turns out it calls replaceState very early in the loading process, before Pace has had a chance to initialize. This should be fixed on master, please let me know either way.

from pace.

Cheers for looking into it ...

I now get no errors, but no loading bar either on a page load, or on an XHR
request ... not sure why

On Thu, Oct 24, 2013 at 3:23 PM, Zack Bloom [email protected]:

I had to dive into the turbolinks code a bit, it turns out it calls
replaceState very early in the loading process, before Pace has had a
chance to initialize. This should be fixed on masterhttps://raw.github.com/HubSpot/pace/master/pace.min.js,
please let me know either way.

—
Reply to this email directly or view it on GitHubhttps://github.com//issues/47#issuecomment-26965860
.

from pace.

Well, that's some kind of progress. What would you say is the easiest way for me to get setup with some sort of testing environment where I can see this happen? Is there an easy way to setup a turbolinks demo app?

from pace.

Was about to try and set you up a vanilla one ... stupidly upgraded to
Maverick OSX and now my Ruby is broken :S

Roughly (off top of head):
gem install rails
rails new pacetestapp
cd pacetestapp

add pace.js to /assets/javascripts
add pace.css to /assets/stylesheets/

bundle exec rails s

http://localhost:3000

On Thu, Oct 24, 2013 at 3:53 PM, Zack Bloom [email protected]:

Reopened #47 #47.

—
Reply to this email directly or view it on GitHubhttps://github.com//issues/47
.

from pace.

OK basic Rails4 w/Turbolinks app here :

https://github.com/jakcharlton/pacetest

Run rails with bundle exec rails s

Open http://locahost:3000/products

Seems some requests work, some don't ... in my main app, none work though
no idea why ...

On Thu, Oct 24, 2013 at 4:13 PM, Jak Charlton [email protected] wrote:

Was about to try and set you up a vanilla one ... stupidly upgraded to
Maverick OSX and now my Ruby is broken :S

Roughly (off top of head):
gem install rails
rails new pacetestapp
cd pacetestapp

add pace.js to /assets/javascripts
add pace.css to /assets/stylesheets/

bundle exec rails s

http://localhost:3000

On Thu, Oct 24, 2013 at 3:53 PM, Zack Bloom [email protected]:

Reopened #47 #47.

—
Reply to this email directly or view it on GitHubhttps://github.com//issues/47
.

from pace.

@jakcharlton I have your example running, thanks for that. Which requests don't work when you look at it?

from pace.

I'm using rails / turbolinks also.

I notice if I download the min.js , It seems to work pretty well page-to-page clicking links - However, I get an

Uncaught Error pace.js?body=1:3
b pace.js?body=1:3
a.getElement pace.js?body=1:3
a.destroy pace.js?body=1:3
Pace.stop pace.js?body=1:3
Pace.restart pace.js?body=1:3
x pace.js?body=1:3
window.history.replaceState.window.history.replaceState pace.js?body=1:3
rememberCurrentUrl turbolinks.js?body=1:167
initializeTurbolinks turbolinks.js?body=1:381
(anonymous function) turbolinks.js?body=1:410
(anonymous function) turbolinks.js?body=1:422

I don't get this error using the non minified copy from master, but then the load indicator doesn't seem to work with turbolinks anymore.

from pace.

Regarding previous message - the link to the minified version from the docs page is before the commit you pushed to fix that error.

from pace.

I'm able to improve the basic turbolinks behavior with jQuery listeners on some of the turbolinks events - https://github.com/rails/turbolinks/

I'm currently using 'page:change' which seems sufficient for my cases but there are probably situations where that won't work as desired

from pace.

I get very good results with following events:

# Show the bar after start of the Turbolinks fetching process
$(document).on 'page:fetch', ->
  Pace.restart()

# Show the bar after Turbolinks added the page into the dom
$(document).on 'page:change', ->
  Pace.restart()

This causes the bar to start over after Turbolinks updates the page of course.

That's why it would be REALLY nice to have a Pace.pause() and Pace.resume() function, then we would have a seamless progress of the bar.

from pace.

@tvdeyen I think we should be able to come up with a turbolinks source for pace. Take a look at #71

A source simply has a progress value which it moves between 0 and 100 as it pleases.

from pace.