WordPress.org

Make WordPress Core

Opened 7 years ago

Closed 7 years ago

#30463 closed defect (bug) (fixed)

Adding second link to a text in Visual editor doesn't work within a table

Reported by: Dumian Owned by:
Milestone: 4.2 Priority: low
Severity: minor Version: 4.0.1
Component: TinyMCE Keywords: has-patch needs-testing
Focuses: javascript, administration Cc:

Description

The problem occurs when you follow these steps:

  1. Create a new page.
  2. Copy the code below and paste it into Text editor:
    <table>
    <tbody>
    <tr>
    <td><img src="some-image.jpg" alt="some-image" width="150" height="150" /></td>
    </tr>
    <tr>
    <td>Lorem ipsum</td>
    </tr>
    </tbody>
    </table>
    
  1. Switch to Visual editor.
  2. Click the image and Insert/Edit link, then choose any page and press Add Link button.
  3. Select whole text below the image and Insert/Edit link, then choose any page and press Add Link button.

Second link wasn't added, in console log you can find TinyMCE related JavaScript error.

You can put any text instead of the image and the bug still occurs. If you will try to add a link again, then it will work.

I'm using the latest version of WordPress, all plugins are deactivated, I've tested the bug with all default themes on two different operating systems (Windows 7 and Ubuntu 12 with the latest Firefox and Chrome).

In case of any problems with reproducing this bug I've made also a video with all steps.

Attachments (1)

30463.patch (650 bytes) - added by tyxla 7 years ago.
Completely agree with @azaozz for the browser dependancy of the issue. This one seems to fix the issue - when removing the range style we're making sure that the proper node is set for startContainer when dealing with a text node.

Download all attachments as: .zip

Change History (9)

#1 @azaozz
7 years ago

  • Keywords needs-patch added
  • Milestone changed from Awaiting Review to 4.2
  • Priority changed from normal to low
  • Severity changed from normal to minor

Hi Dumian, thanks for the bug report.

I can reproduce it inconsistently and is somewhat browser dependent. Doesn't happen in IE. In Firefox and Chrome usually the first attempt fails, but the second attempt succeeds. Depends on what is selected when you try to select all text inside a <td>. If the <td> node is selected, you cannot wrap it in a link, if only text node(s) is/are selected, or <img>, <span>, etc. it works as expected.

Seems we will have to look at the current selection in https://core.trac.wordpress.org/browser/trunk/src/wp-includes/js/wplink.js#L265 in non-IE browsers.

Currently cannot reproduce this for any other tags, so perhaps a fix is needed only for <td>.

#2 @valendesigns
7 years ago

I've been testing this bug trying to figure out a way to fix text in a <td> node that is not wrapped in another node, but the major hurdle is that it has extremely inconsistent behavior. There are a bunch of ways to get it to work and break, which makes it very hard to fix and test.

For example, if you don't select all the text you have a better chance of making it work, unless you select the first word which will break on the first insert but work on a second and continue working on other text in the table. It's very strange that it works so intermittently and is usually only the first or second attempt that breaks depending on where your cursor begins and ends.

@azaozz Do you have any speculations on how this might be fixed?

@tyxla
7 years ago

Completely agree with @azaozz for the browser dependancy of the issue. This one seems to fix the issue - when removing the range style we're making sure that the proper node is set for startContainer when dealing with a text node.

#3 @tyxla
7 years ago

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

#4 follow-up: @SergeyBiryukov
7 years ago

Any patches to TinyMCE core should be suggested upstream.

#5 in reply to: ↑ 4 ; follow-up: @tyxla
7 years ago

Replying to SergeyBiryukov:

Any patches to TinyMCE core should be suggested upstream.

Makes complete sense. I'm just sending what worked for me.
We should definitely consider reporting this issue to the core TinyMCE developers.

#6 in reply to: ↑ 5 @azaozz
7 years ago

Replying to tyxla:

We should definitely consider reporting this issue to the core TinyMCE developers.

Right, passed this upstream. Confirmed the patch fixes it in Chrome and Firefox, good job!

#7 @DrewAPicture
7 years ago

@azaozz: Do you have a link to the relevant PR for TinyMCE? I see one closed PR that should be included with 4.1.8 (whenever that is released and merged into core).

Also worth noting that though adding the second link tosses an error, that second link is there once you've saved the post, just not immediately available.

#8 @iseulde
7 years ago

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

Fixed in [31700], see #31551.

Note: See TracTickets for help on using tickets.