Sidebar is not sticky #2770

Can you take a screenshot of the whole sidebar at 100%?

When the sidebar refreshes the listener forgets about it (because it’s a new element) so we need to use or helper (I think called onUpdatableContent…) to make sure it’s listened to again.

Which screenshot do you need me to take exactly?

Same as above, but after zooming to make the sidebar appear? Or the normal view at the very top?

1. Zoom at 100%
2. Refresh the page
3. Scroll just enough that the whole sidebar is visible
4. Take a screenshot

And also, is the sidebar sticky after doing this?

Can you take a screenshot of the whole sidebar at 100%?

<br>

And also, is the sidebar sticky after doing this?

Making the sidebar appear via zooming in or out work, going back to 100% after that keeps it. Refreshing the page then makes the sidebar disappear.

<br>

I also realized that moving out of fullscreen makes the sidebar sticky again. Going back won't change that then. Refreshing the page in fullscreen removes it again.

Avoid using the zoom/fullscreen to test it, it's irrelevant: the stickiness is determined on resize, so just resize the window.

It's working for me, as long as it fits the window, but as mentioned earlier, if the sidebar updates, then it stops being sticky until the next resize

Resizing has the same result. Moving down leads to the sidebar disappearing. Making the window narrower suddenly makes it appear. Going back to normal width keeps it until hitting refresh.

How does the sidebar update in between? It never works for me out of the box.

Please record a screencast because I have no idea

Also try in chrome (after logging into GitHub) and look for errors in the console, if any

Please record a screencast because I have no idea

https://screencast-o-matic.com/watch/cYn2oPwyaf

So I think that at the first load, the sidebar is not found and the feature fails silently. Then resize does find it and it keeps working.

I looked at the code and it should not fail silently. Can you open the Browser Console, clear it, and refresh this page?

Firefox doesn’t show errors in the regular console, so open the Browser Console from the Developer menu

ℹ️ Refined GitHub: show-names: Personal token required for this feature features.tsx:85:20 ℹ️ Refined GitHub: bugs-tab: Personal token required for this feature features.tsx:85:20 undefined pageModifier.js:585:17 Use of Mutation Events is deprecated. Use MutationObserver instead. pageModifier.js:81:24 This site appears to use a scroll-linked positioning effect. This may not work well with asynchronous panning; see https://developer.mozilla.org/docs/Mozilla/Performance/ScrollLinkedEffects for further details and to join the discussion on related tools and features! 2770

​

Can't reproduce this in Firefox 74 (Developer Edition), but I also get the waring when scrolling down and the sidebar starts beeing sticky.

This site appears to use a scroll-linked positioning effect. This may not work well with asynchronous panning; see https://developer.mozilla.org/docs/Mozilla/Performance/ScrollLinkedEffects for further details and to join the discussion on related tools and features!

Edit: Also get the show-names and bugs-tab logs, but I don't think they are related to this issue.

ℹ️ Refined GitHub: show-names: Personal token required for this feature features.tsx:85:20

@tooomm Does the issue presets when you add an GitHub personal access token in GitHub Refined settings?:

Can't reproduce this in Firefox 74 (Developer Edition), but I also get the waring when scrolling down and the sidebar starts beeing sticky.

@dertieran Exactly. When the sideboard should start moving/being sticky the warning appears in the log for me, too. But it works for you nevertheless? I'm on Firefox 73.0 (64bit), Windows 10. Do you use the 32bit version or a different OS?

@tooomm I'm running on Arch Linux. Do you know where pageModifier.js is from? That doesn't look like rgh, maybe it's some extensions clashing?

Do you know where pageModifier.js is from? That doesn't look like rgh, maybe it's some extensions clashing?

It's from Citavi Picker

I disabled all extensions except uBlock Origin, NoScript and a search provider next to Refined GitHub. No change, even disabling those one by one didn't change the result.

The warning is not caused by this feature, it’s about scroll event listeners, which we don’t have. We only listen to resize, the rest is handled by position: sticky.

I'm sorry @fregante. But with only Refined GitHub enabled I still get those:

@fregante is right the warning doesn't have anything to do with this issue either. :disappointed: It is caused by the way Github makes the issue header sticky, they listen for the scroll event. Coincidentally that happens around the same time as the sidebar getting sticky, you can test that by also disabling rgh.

That makes sense! Ok, the console events don’t help us here then.

Can you try FF 73 maybe @dertieran ?

It's not working for Chrome too. Along with other features

Chromium Version 79.0.3945.130 (Official Build) Arch Linux (64-bit)

@tooomm are you checking the Browser Console? That looks like the Web Console, it won't show errors from extensions.

@tunnckoCore #2796

@tooomm are you checking the Browser Console? That looks like the Web Console, it won't show errors from extensions.

You are so right. First time using either of them, thanks for pointing out. 🙈

I get these messages there (only Refined GitHub enabled):

NS_ERROR_FAILURE: Component returned failure code: 0x80004005 (NS_ERROR_FAILURE) [nsIInterfaceRequestor.getInterface] network-response-listener.js:84 NS_ERROR_FAILURE: Component returned failure code: 0x80004005 (NS_ERROR_FAILURE) [nsIInterfaceRequestor.getInterface] network-response-listener.js:84

They appear right after loading the page.

Maybe I know the reason. Try this:

1. Make the window as big as possible
2. Zoom out
3. Refresh the page

This should guarantee that the sidebar has enough viewport space to be always visible so the feature should always work.

If it works, this is probably due to clean-sidebar:

1. sticky-discussion-sidebar runs, the sidebar doesn't fit, so it doesn't make it sticky
2. clean-sidebar runs, reduces the sidebar height, but it's too late for sticky-sidebar.

At this point you think that the sticky feature doesn't work because "the sidebar fits!11!1"

Possible fix: move

https://github.com/sindresorhus/refined-github/blob/5d15c14f36dd20ee72ba3fe933b8d0756e8f9892/source/content.ts#L48

after

https://github.com/sindresorhus/refined-github/blob/5d15c14f36dd20ee72ba3fe933b8d0756e8f9892/source/content.ts#L127

Maybe I know the reason. Try this:

1. Make the window as big as possible
2. Zoom out
3. Refresh the page

That made it work for me. After doing so and changing zoom to 100% again the sidebar was sticky and stayed sticky when scrolling.

Thanks for taking care! It works :)