« first day (921 days earlier)      last day (503 days later) » 

9:04 PM
@VLAZ FWIW the missing ul li elements are a result of the realtime.reloadPosts return not having the appropriate structure. If you put the bare tag links back into a list elements $('.question .post-tag').wrap('<li class=\'d-inline mr4 js-post-tag-list-item\'>').parent().wrapAll('<ul class=\'ml0 list-ls-none js-post-tag-list-wrapper d-inline\'>') just calling StackExchange.inlineTagEditing.init(); again works.
I agree though that the realtime endpoints definitely should not return substantively different html structure than what is shipped natively with the page
 
9:58 PM
Yes, it's down to the backend template for posts being different between "full page" and "one post reload" mode. In fact, most likely the live reload ignores who the user is and uses the <10k template to render the post.
The main issue is that I wanted an unobtrusive script. Which will gracefully stop working and yield to the correct implementation. To this effect, I expected to just need to add the Edit tags button. And I could have made a check to not add it if it's already there. The plan was:
1. Find and cache the Edit tags button if there. So, if not found (UI changes) or just not present (no privilege) this is the end and the script doesn't go further.
2. On reload, the script could have easily examine the reloaded HTML and check for a similar structure as the button. If not there re-add it from the cache.
However, since there are two different, unconnected templates, not only does the script have to massage the HTML to be correct, but also if the bug is fixed by SE, there is a high likelyhood that the userscript will now be a bug by potentially adding the button twice or maybe even destroying the HTML which was already correct.
It could even be that both templates change, so the post processing of the reload template 1. is not correct because the reload HTML is different 2. it won't match the full page HTML anyway.
 
10:23 PM
Honestly this is the best I have
$(document).on('refreshEdit', async () => {
    const tryIt = () => {
        // HTML structure hasn't been replaced yet
        if ($('#edit-tags').length > 0) {
            return false;
        }
        // Fix HTML structure returned from the realtime end point
        $('.question .post-tag')
            .wrap('<li class=\'d-inline mr4 js-post-tag-list-item\'>')
            .parent().wrapAll('<ul class=\'ml0 list-ls-none js-post-tag-list-wrapper d-inline\'>');
        // Init the editor
        StackExchange.inlineTagEditing.init();
It definitely works... it's just frustrating that they emit an event before the asynchronous reloadPosts finishes. If only they'd wait for reloadposts to end like `reloadPosts([post.id]).then(() => {
$(document).trigger('refreshEdit', post.id);
});`
I would prefer to proxy StackExchange.realtime.reloadPosts, but I can't because the reloadPosts that is used in postEdit isn't StackExchange.realtime.reloadPosts but rather the local definition (before it's been attached to StackExchange) so Proxying doesn't affect that function call at all.
 
Meh, when I was doing a quick test I just attached a mutation observer on document.body and watched for any post reloads. Yes, it's more crude but works better. Also crude but effective - adding a listener to the global ajaxComplete. Can be filtered to only really execute on reload requests by examining the response and where it came from.
I find that ajaxComplete is quite effective in most cases. Saves you trying to hunt down for the correct trigger on the page, if the trigger is a network call.
 
A mutation observer to wait for '#edit-tags' to disappear would probably work as well...
 

« first day (921 days earlier)      last day (503 days later) »