Skip to content

fix(PlainTable): Add paragraph node, required for table cells #8052

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We鈥檒l occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
mejo- merged 2 commits into from
Dec 13, 2025
Merged

fix(PlainTable): Add paragraph node, required for table cells #8052

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
abf34d8
test(playwright): Don't upload and open text file in create-table-api
mejo- Dec 13, 2025
d130d26
fix(PlainTable): Add paragraph node, required for table cells
mejo- Dec 13, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
101 changes: 51 additions & 50 deletions playwright/e2e/create-table-api.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,15 +3,45 @@
* SPDX-License-Identifier: AGPL-3.0-or-later
*/

import { expect, mergeTests } from '@playwright/test'
import { test as randomUserTest } from '../support/fixtures/random-user'
import { test as uploadFileTest } from '../support/fixtures/upload-file'

const test = mergeTests(uploadFileTest, randomUserTest)
import type { Page } from '@playwright/test'
import { expect } from '@playwright/test'
import { test } from '../support/fixtures/random-user'

test.describe('createTable API', () => {
test.beforeEach(async ({ open, page }) => {
await open()
const containerId = 'test-table'

const createTable = async (
page: Page,
options: { content: string; readOnly: boolean },
) => {
await page.evaluate(
async ({ containerId, content, readOnly }) => {
const container = document.createElement('div')
container.id = containerId
container.style.position = 'fixed'
container.style.top = '0'
container.style.left = '0'
container.style.width = '100%'
container.style.height = '100%'
container.style.padding = '50px'
container.style.zIndex = '10000'
container.style.background = 'white'
document.body.appendChild(container)

// @ts-expect-error - OCA.Text is a global
await window.OCA.Text.createTable({
el: container,
content,
readOnly,
})
},
{ containerId, ...options },
)
}

test.beforeEach(async ({ page }) => {
// Open the files app so we're somewhere with `window.OCA.Text` available
await page.goto('/apps/files')

// Load the editor API bundle
await page.addScriptTag({
Expand All @@ -21,44 +51,23 @@ test.describe('createTable API', () => {
})

test('renders table editor', async ({ page }) => {
await page.evaluate(async () => {
const container = document.createElement('div')
container.id = 'test-table'
document.body.appendChild(container)

// @ts-expect-error - OCA.Text is a global
await window.OCA.Text.createTable({
el: container,
content: '| A | B |\n|---|---|\n| 1 | 2 |',
readOnly: false,
})
await createTable(page, {
content: '| A | B |\n|---|---|\n| 1 | 2 |',
readOnly: false,
})

await expect(page.locator('#test-table table')).toBeVisible()
await expect(page.locator('#test-table th').first()).toContainText('A')
await expect(page.locator('#test-table td').first()).toContainText('1')
await expect(page.locator(`#${containerId} table`)).toBeVisible()
await expect(page.locator(`#${containerId} th`).first()).toContainText('A')
await expect(page.locator(`#${containerId} td`).first()).toContainText('1')
})

test('allows editing when not readonly', async ({ page }) => {
await page.evaluate(async () => {
const container = document.createElement('div')
container.id = 'test-editable'
container.style.position = 'fixed'
container.style.top = '10px'
container.style.left = '10px'
container.style.zIndex = '10000'
container.style.background = 'white'
document.body.appendChild(container)

// @ts-expect-error - OCA.Text is a global
await window.OCA.Text.createTable({
el: container,
content: '| A |\n|---|\n| x |',
readOnly: false,
})
await createTable(page, {
content: '| A |\n|---|\n| x |',
readOnly: false,
})

const cell = page.locator('#test-editable .ProseMirror td').first()
const cell = page.locator(`#${containerId} .ProseMirror td`).first()
await cell.click({ force: true })
await page.waitForTimeout(100)
await cell.selectText()
Expand All @@ -68,20 +77,12 @@ test.describe('createTable API', () => {
})

test('prevents editing when readonly', async ({ page }) => {
await page.evaluate(async () => {
const container = document.createElement('div')
container.id = 'test-readonly'
document.body.appendChild(container)

// @ts-expect-error - OCA.Text is a global
await window.OCA.Text.createTable({
el: container,
content: '| A |\n|---|---|\n| 1 |',
readOnly: true,
})
await createTable(page, {
content: '| A |\n|---|---|\n| 1 |',
readOnly: true,
})

const editable = page.locator('#test-readonly [contenteditable]').first()
const editable = page.locator(`#${containerId} [contenteditable]`).first()
await expect(editable).toHaveAttribute('contenteditable', 'false')
})
})
3 changes: 2 additions & 1 deletion src/extensions/PlainTable.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@
import { Extension } from '@tiptap/core'

import EditableTable from './../nodes/EditableTable.js'
import Paragraph from './../nodes/Paragraph.js'
import PlainTableDocument from './../nodes/PlainTableDocument.js'
import Keymap from './Keymap.js'
import Markdown from './Markdown.js'
Expand All @@ -16,6 +17,6 @@ export default Extension.create({
name: 'PlainTable',

addExtensions() {
return [Markdown, PlainTableDocument, EditableTable, Keymap, Text]
return [Markdown, Paragraph, PlainTableDocument, EditableTable, Keymap, Text]
},
})
Loading