Sort/order widgets causes duplicate

[MrLucky]

Expected behavior

When draggi/drop to sortthe order of widgets on the widget page, they would normally change order as

Current behavior

(all plugins disabled) When you drag a widget to a different place it seems to work as expected, until you refresh the page and it seems a duplicate has been created.

If you delete the duplicate it seems to be deleted leaving the original, HOWEVER when you refresh the page the original is also gone.

This happens with Safari, but not Chrome where it behaves normally.

1: Sidebar:

2: After moving Serach widget to bottom:

3: After refreshing browser:

4: After deleting duplicate Search widget

5: After refershing browser:

NB: This is happening after applying the fix to the Safari menu sorting issue here:

@timkaye

If that doesn’t work, please revert the code and try the following instead. You will still need define( 'SCRIPT_DEBUG', true ); in the wp-config.php file.

Go up to line 223, which begins forceFallback and comment it out. Then uncomment the line below it.

If that still doesn’t work, then comment out BOTH those lines and try again.

[MattyRob]

I have also seen something like this with Widget duplication in the proposed Pull Request to fix this issue.

Remove Safari fallbacks from SortableJS

Clearly we ned to keep investigating.

[timkaye]

@MrLucky Could you use the browser inspector to find the both the correct and duplicated elements, and then copy and paste the details here, please? (And identify which is the one you consider the correct one.)

Could you also try replacing the current file at ~wp-admin/js/widgets.js with the one I’m uploading here? You will still need define( 'SCRIPT_DEBUG', true ); in the wp-config.php file.

widgets.js (22.6 KB)

[MrLucky]

I dragged a meta widget and got the issue.

This is the correct position:

This is for the duplicate that appeared at the bottom of the widget list when refreshing page:

Source code:

[timkaye]

Thank you!

The previous two bugs you reported were caused by (a) Safari finally fixing a bug and (b) Safari creating a new bug. My research tells me that the bug you’ve reported here is another one for which Safari is known.

The source code you’ve shown here tells me that Safari is causing the action on drop to be submitted twice. This causes the duplicate widget to be created with the same widget ID (in this case, meta-4) as the original. Because the two widgets share the same ID, deleting one deletes them both.

Could you see what happens if, after moving a widget and getting that duplicate on saving, you leave it alone but switch to another browser? Does the second browser see the duplicate widget?

[MrLucky]

Yes. Chrome sees the duplicate widget, both on the Widgets page and is visual on the page view

[timkaye]

That’s bad news! I was hoping we could just hide it from Safari, but apparently not. I’m not sure what the best approach to this is now because the obvious way of adding a check to delete the duplicate widget won’t work without deleting the original.

[timkaye]

I have had an idea! Let’s try preventing a duplicate call to the database. Could you try replacing the current file at ~wp-admin/js/widgets.js with the one below? You will still need define( 'SCRIPT_DEBUG', true ); in the wp-config.php file.

widgets.js (22.8 KB)

[MrLucky]

That seems to have sorted it.

[timkaye]

Yay! You’ve made my day!