WordPress.org

Make WordPress Core

Opened 4 years ago

Closed 4 years ago

Last modified 4 years ago

#33596 closed defect (bug) (fixed)

Bug in Comment Quick Edit in smaller screen

Reported by: gyan Owned by: helen
Milestone: 4.3.1 Priority: normal
Severity: normal Version: 4.3
Component: Comments Keywords: has-patch needs-testing has-screenshots
Focuses: ui, administration Cc:
PR Number:

Description

There is display issue in Comments Quick Edit mode when screen size is less than 782px.
There is no issue if screen size greater than 782px.

I have tested with both Google Chrome and Mozilla Firefox.
I am using Windows 7.

Attachments (10)

comment-quick-edit-bug.png (61.3 KB) - added by gyan 4 years ago.
Comment Quick Edit issue
33596.comments-meta-box.png (40.0 KB) - added by SergeyBiryukov 4 years ago.
33596.patch (1.2 KB) - added by SergeyBiryukov 4 years ago.
33596.comments-meta-box-quick-edit.png (26.5 KB) - added by SergeyBiryukov 4 years ago.
image.jpg (140.3 KB) - added by ryan 4 years ago.
Quick edit bug as seen on an iPhone 6+
33596.2.patch (1.9 KB) - added by ocean90 4 years ago.
33596.3.patch (2.4 KB) - added by ocean90 4 years ago.
33596.desktop.after.png (114.5 KB) - added by ocean90 4 years ago.
33596.iphone.after.png (67.0 KB) - added by ocean90 4 years ago.
33596.4.patch (1013 bytes) - added by afercia 4 years ago.

Download all attachments as: .zip

Change History (28)

@gyan
4 years ago

Comment Quick Edit issue

#1 @gyan
4 years ago

  • Keywords needs-patch added

#2 @SergeyBiryukov
4 years ago

  • Component changed from General to Comments
  • Focuses administration added

#3 @SergeyBiryukov
4 years ago

  • Milestone changed from Awaiting Review to 4.3.1

Introduced in [33016], which changed <tr id="replyrow"> from display: table-cell to display: block due to .wp-list-table tr:not(.inline-edit-row) td:not(.check-column) in line 1750.

I've found a related issue in Comments meta box: .column-author does not get hidden, leading to duplicate author name, see 33596.comments-meta-box.png.

33596.patch fixes both of these issues, but appears to introduce a new one: if you quick edit one comment in the meta box, others shrink to 50%, see 33596.comments-meta-box-quick-edit.png.

#4 @SergeyBiryukov
4 years ago

#33656 was marked as a duplicate.

#5 @SergeyBiryukov
4 years ago

#33700 was marked as a duplicate.

#6 @mocnidabar
4 years ago

I found a way to fix CSS issue for Comments Quick Edit and Reply when screen size is less than 782px.

#replyrow td {
    display: table-cell;
}

#7 @SergeyBiryukov
4 years ago

#33799 was marked as a duplicate.

#8 @lancewillett
4 years ago

@SergeyBiryukov maybe this ticket should mention Kindle Fire Silk browser to make it easier to find in ticket searches.

#9 @helen
4 years ago

The half-width thing in 33596.comments-meta-box-quick-edit.png is because the quick edit/reply row has a colspan of 2 (and I think some other things do, like the undo message) - I don't remember what I did to handle this in other list tables, but that's where to look.

@ryan
4 years ago

Quick edit bug as seen on an iPhone 6+

#10 @samuelsidler
4 years ago

  • Owner set to helen
  • Status changed from new to assigned

@ocean90
4 years ago

@ocean90
4 years ago

#11 @ocean90
4 years ago

  • Keywords has-patch needs-testing added; needs-patch removed

33596.3.patch gives input fields more width on narrow screens and updates the colspan attribute, see [33015] for posts and terms. Since the comment metabox has no table header I'm using c which holds a comment row.

#12 @helen
4 years ago

  • Resolution set to fixed
  • Status changed from assigned to closed

In 34094:

Comments: Fix inline edit/reply on small screens.

props ocean90, SergeyBiryukov.
fixes #33596.

#13 @helen
4 years ago

In 34095:

Comments: Fix inline edit/reply on small screens.

Merges [34094] to the 4.3 branch.

props ocean90, SergeyBiryukov.
see #33596.

#14 @afercia
4 years ago

  • Resolution fixed deleted
  • Status changed from closed to reopened

Just noticed: edit a Post that already has some comments. The "Add new Comment" will look like this;

https://cldup.com/4aODRSJXXC.png

This is because the table with comments here has two columns but the colspan attribute set with JavaScript will be 0. Doesn't happen in Posts that don't have comments yet, since there's no table there.

Minor: in Dashboard > Activity > Comments, the comments list doesn't use a table and #replyrow is a <div>; we shouldn't try to set a colspan there, even if at the moment it doesn't break anything.

@afercia
4 years ago

#15 @afercia
4 years ago

Attached patch tries to be a bit more specific, checks if replyrow is really the inline-edit-row and if the colspan value is not 0.

#16 @SergeyBiryukov
4 years ago

  • Resolution set to fixed
  • Status changed from reopened to closed

In 34179:

Comments: When setting the colspan value for inline edit/reply, make sure it's actually a table and the value is not empty.

Props afercia.
Fixes #33596.

#17 @SergeyBiryukov
4 years ago

In 34180:

Comments: When setting the colspan value for inline edit/reply, make sure it's actually a table and the value is not empty.

Merges [34179] to the 4.3 branch.

Props afercia.
See #33596.

#18 @ryan
4 years ago

  • Keywords has-screenshots added
Note: See TracTickets for help on using tickets.