Gapcursor and tables

1

When using the GapCursor, I have a weird behavior

Here is the document :

image

A table with one row and two columns. Each cell has a horizontal line at the first position

If I hit “left” while the horizontal line in the second cell is selected, then Gapcursor works:

image

But if I do the same in the first cell then the cursor is sent to the line before the table ( and not just before the horizontal line inside the cell)

Same things when hitting “right” on the second cell (but works while on the first cell)

Is that the expected behavior?

Thank

2

The gap cursor is drawn as a horizontal line, so I think you’re not seeing a gap cursor in that screenshot. What do the document structure inside the cell and the DOM structure look like at this point?

3

I modified the css to make it look like a regular cursor that’s why it is not horizontal

Here is the document structure:

{
  "type": "doc",
  "content": [
    {
      "type": "paragraph",
      "attrs": {
        "align": "left"
      },
      "content": [
        {
          "type": "text",
          "text": "asfas"
        }
      ]
    },
    {
      "type": "table",
      "content": [
        {
          "type": "table_row",
          "content": [
            {
              "type": "table_cell",
              "attrs": {
                "colspan": 1,
                "rowspan": 1,
                "colwidth": [
                  50
                ],
                "background": null,
                "borderleft": "1px solid",
                "bordertop": "1px solid",
                "borderbottom": "1px solid",
                "borderright": "1px solid",
                "verticalalign": "top"
              },
              "content": [
                {
                  "type": "horizontal_rule"
                }
              ]
            },
            {
              "type": "table_cell",
              "attrs": {
                "colspan": 1,
                "rowspan": 1,
                "colwidth": [
                  49.89293361884368
                ],
                "background": null,
                "borderleft": "1px solid",
                "bordertop": "1px solid",
                "borderbottom": "1px solid",
                "borderright": "1px solid",
                "verticalalign": "top"
              },
              "content": [
                {
                  "type": "horizontal_rule"
                }
              ]
            }
          ]
        }
      ]
    }
  ]
}

And here is the dom:

<div class="tableWrapper">
   <table>
      <colgroup>
         <col style="width: 50%;">
         <col style="width: 49.8929%;">
      </colgroup>
      <tbody>
         <tr>
            <td class="cell-prosemirror" data-colwidth="50" style="border-left: 1px solid;border-top: 1px solid;border-bottom: 1px solid;border-right: 1px solid;vertical-align: top;">
               <hr class="" contenteditable="false">
            </td>
            <td class="cell-prosemirror" data-colwidth="49.89293361884368" style="border-left: 1px solid;border-top: 1px solid;border-bottom: 1px solid;border-right: 1px solid;vertical-align: top;">
               <div class="ProseMirror-gapcursor ProseMirror-widget" contenteditable="false"></div>
               <hr class="" contenteditable="false">
            </td>
         </tr>
      </tbody>
   </table>
</div>

From inspecting the code, the difference when you hit “left” on the second cell or a the first cell is the returns of closedBefore which returns false in the first cell and true in the second cell

4

Does this patch help with this issue?

5

Yes totally solved it, thank you very much

6

Great, tagged as prosemirror-gapcursor 1.2.1.