Skip to content

Commit e5c3aa4

Browse files
authored
Nuxt3 migration continue (baserow#4595)
* Refactor store registration to use SSR methods across multiple plugins for improved state management * fix database file field drag and drop * fix storybook dependencies warning. * refactor: Replace `useAsyncData` with a direct `watch` and `renderMarkdown` function for markdown content. * fix workspace hydratation warning * replace direct `role.isBillable` access with `roleIsBillable` computed property * fix auth settings form * fix alert slot usage * please linter * please prettier * fix SSR rendering * refactor: simplify relay state URL generation by directly passing the user source object. * refactor: Replace `registerModuleSSR` with `registerModuleNuxtSafe` for Vuex module registration across all plugins. * please linter * fix: add retry logic for Firefox NS_BINDING_ABORTED navigation errors in E2E tests * test: reload page and assert link visibility using getByRole after setting parameters. * refactor: simplify `goto` navigation by removing retry logic and adding a fixed delay. * refactor: trigger initial markdown rendering via immediate watcher option * update snapshots
1 parent ee21b01 commit e5c3aa4

File tree

31 files changed

+315
-245
lines changed

31 files changed

+315
-245
lines changed

.env.local-dev.example

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -67,4 +67,4 @@ EMAIL_PORT=1025
6767
# Media files (path relative to the backend folder)
6868
# =============================================================================
6969
MEDIA_ROOT=media
70-
MEDIA_URL=http://localhost:4000/media/
70+
MEDIA_URL=http://localhost:8000/media/

e2e-tests/pages/baserowPage.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@ export class BaserowPage {
2424
}
2525

2626
async goto(params = {}) {
27+
await this.page.waitForTimeout(100); // Small delay before navigation to help with Firefox timing issues
2728
await this._goto(this.getFullUrl(), {
2829
waitUntil: "hydration",
2930
...params,
@@ -37,7 +38,7 @@ export class BaserowPage {
3738
async changeDropdown(
3839
currentValue: string,
3940
newValue: string,
40-
location?: Locator
41+
location?: Locator,
4142
) {
4243
await (location ? location : this.page)
4344
.locator(".dropdown__selected-text")

e2e-tests/tests/builder/builder.spec.ts

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,8 @@
11
import { expect, test } from "../baserowTest";
22

33
test.describe("Builder application test suite", () => {
4-
test.beforeEach(async ({ workspacePage, goto }) => {
5-
await goto(workspacePage.getFullUrl(), { waitUntil: "hydration" });
6-
//await workspacePage.goto();
4+
test.beforeEach(async ({ workspacePage }) => {
5+
await workspacePage.goto();
76
});
87

98
test("Can create builder application", async ({ page }) => {
@@ -14,7 +13,7 @@ test.describe("Builder application test suite", () => {
1413

1514
await expect(
1615
page.locator(".page-editor").getByText("Page settings"),
17-
"Check we see the default page."
16+
"Check we see the default page.",
1817
).toBeVisible();
1918
});
2019

@@ -28,7 +27,7 @@ test.describe("Builder application test suite", () => {
2827

2928
await expect(
3029
page.locator(".tree__link").getByText("My super application"),
31-
"Checks the name of the application is displayed in the sidebar."
30+
"Checks the name of the application is displayed in the sidebar.",
3231
).toBeVisible();
3332
});
3433
});

e2e-tests/tests/builder/builderPage.spec.ts

Lines changed: 13 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ test.describe("Builder page test suite", () => {
2323
await expect(
2424
page
2525
.locator(".preview-navigation-bar__address-bar-path")
26-
.getByText("/complex/path")
26+
.getByText("/complex/path"),
2727
).toBeVisible();
2828
});
2929

@@ -46,7 +46,7 @@ test.describe("Builder page test suite", () => {
4646

4747
await page.locator(".button").getByText("Save").click();
4848
await expect(
49-
page.getByText("The page settings have been updated.")
49+
page.getByText("The page settings have been updated."),
5050
).toBeVisible();
5151

5252
await page.locator(".modal__close", { title: "Close" }).click();
@@ -55,7 +55,7 @@ test.describe("Builder page test suite", () => {
5555
await expect(
5656
page
5757
.locator(".preview-navigation-bar__address-bar-path")
58-
.getByText("/new/path")
58+
.getByText("/new/path"),
5959
).toBeVisible();
6060
});
6161

@@ -64,10 +64,10 @@ test.describe("Builder page test suite", () => {
6464
await page.getByText("Heading", { exact: true }).click();
6565

6666
await expect(
67-
page.locator(".modal__box").getByText("Add new element")
67+
page.locator(".modal__box").getByText("Add new element"),
6868
).toBeHidden();
6969
await expect(
70-
page.locator(".element-preview__name-tag").getByText("Heading")
70+
page.locator(".element-preview__name-tag").getByText("Heading"),
7171
).toBeVisible();
7272
});
7373

@@ -80,10 +80,10 @@ test.describe("Builder page test suite", () => {
8080
await page.getByText("Heading", { exact: true }).click();
8181

8282
await expect(
83-
page.locator(".modal__box").getByText("Add new element")
83+
page.locator(".modal__box").getByText("Add new element"),
8484
).toBeHidden();
8585
await expect(
86-
page.locator(".element-preview__name-tag").getByText("Heading")
86+
page.locator(".element-preview__name-tag").getByText("Heading"),
8787
).toBeVisible();
8888
});
8989

@@ -131,7 +131,7 @@ test.describe("Builder page test suite", () => {
131131
// Save the page
132132
await page.getByRole("button", { name: "Save" }).click();
133133
await expect(
134-
page.getByText("The page settings have been updated.")
134+
page.getByText("The page settings have been updated."),
135135
).toBeVisible();
136136

137137
// Close the modal
@@ -157,15 +157,18 @@ test.describe("Builder page test suite", () => {
157157
],
158158
});
159159

160-
await page.getByText("linkim");
160+
// Reload the page to see the newly created element
161+
await builderPagePage.goto();
162+
163+
await expect(page.getByRole("link", { name: "linkim" })).toBeVisible();
161164

162165
// Set the value of page parameters
163166
await page.getByLabel("my_param=").fill("foo");
164167
await page.getByLabel("my_param2=").fill("15");
165168

166169
await expect(page.getByRole("link", { name: "linkim" })).toHaveAttribute(
167170
"href",
168-
/\?my_param2=15&my_param=foo/
171+
/\?my_param2=15&my_param=foo/,
169172
);
170173
});
171174
});

enterprise/web-frontend/modules/baserow_enterprise/components/crudTable/fields/HighestPaidRoleField.vue

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
href="https://baserow.io/user-docs/subscriptions-overview#who-is-considered-a-user-for-billing-purposes"
77
target="_blank"
88
>
9-
<Badge v-if="role && role.isBillable" color="cyan" class="margin-left-1"
9+
<Badge v-if="roleIsBillable" color="cyan" class="margin-left-1"
1010
>{{ $t('highestPaidRoleField.billable') }}
1111
</Badge>
1212
</a>
@@ -33,6 +33,9 @@ export default {
3333
roleName() {
3434
return this.role ? this.role.name : ''
3535
},
36+
roleIsBillable() {
37+
return this.role ? this.role.isBillable : false
38+
},
3639
role() {
3740
return this.roles.find((r) => r.uid === this.roleUID)
3841
},

enterprise/web-frontend/modules/baserow_enterprise/integrations/common/components/CommonOIDCSettingForm.vue

Lines changed: 13 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,12 @@
99
<OpenIdConnectSettingsForm
1010
v-bind="$attrs"
1111
ref="form"
12-
@values-changed="checkValidity"
12+
:auth-provider="authProvider"
13+
:auth-provider-type="authProviderType"
14+
:auth-providers="authProviders"
15+
:default-values="defaultValues"
16+
:disabled="disabled"
17+
@values-changed="onValuesChanged"
1318
>
1419
<template #config>
1520
<FormGroup
@@ -54,7 +59,7 @@ import { copyToClipboard } from '@baserow/modules/database/utils/clipboard'
5459
5560
export default {
5661
name: 'CommonOIDCSettingsForm',
57-
emits: ['delete'],
62+
emits: ['delete', 'values-changed'],
5863
components: { OpenIdConnectSettingsForm, AuthProviderWithModal },
5964
mixins: [authProviderForm],
6065
props: {
@@ -80,8 +85,8 @@ export default {
8085
8186
const userSourceUid = userSourceType.genUid(this.userSource)
8287
83-
const url = `${this.app.$config.public.publicBackendUrl}/api/user-source/${userSourceUid}/sso/oauth2/openid_connect/callback/`
84-
const previewUrl = `${this.app.$config.public.publicBackendUrl.substr(
88+
const url = `${this.$config.public.publicBackendUrl}/api/user-source/${userSourceUid}/sso/oauth2/openid_connect/callback/`
89+
const previewUrl = `${this.$config.public.publicBackendUrl.substr(
8590
0,
8691
10
8792
)}.../user-source/${userSourceUid}/sso/...`
@@ -113,6 +118,10 @@ export default {
113118
},
114119
methods: {
115120
copyToClipboard,
121+
onValuesChanged(values) {
122+
this.checkValidity()
123+
this.$emit('values-changed', values)
124+
},
116125
checkValidity() {
117126
if (!this.$refs.form.isFormValid() && this.$refs.form.v$.$anyDirty) {
118127
this.inError = true

enterprise/web-frontend/modules/baserow_enterprise/integrations/common/components/CommonSamlSettingForm.vue

Lines changed: 20 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,12 @@
99
<SamlSettingsForm
1010
v-bind="$attrs"
1111
ref="form"
12-
@values-changed="checkValidity"
12+
:auth-provider="authProvider"
13+
:auth-provider-type="authProviderType"
14+
:auth-providers="authProviders"
15+
:default-values="defaultValues"
16+
:disabled="disabled"
17+
@values-changed="onValuesChanged"
1318
>
1419
<template #config>
1520
<FormGroup
@@ -77,12 +82,16 @@ export default {
7782
type: Object,
7883
required: true,
7984
},
85+
application: {
86+
type: Object,
87+
required: true,
88+
},
8089
userSource: {
8190
type: Object,
8291
required: true,
8392
},
8493
},
85-
emits: ['delete'],
94+
emits: ['delete', 'values-changed'],
8695
setup() {
8796
return { v$: useVuelidate({ $lazy: true }) }
8897
},
@@ -104,8 +113,16 @@ export default {
104113
},
105114
methods: {
106115
copyToClipboard,
116+
onValuesChanged(values) {
117+
this.checkValidity()
118+
this.$emit('values-changed', values)
119+
},
107120
checkValidity() {
108-
if (!this.$refs.form.isFormValid() && this.$refs.form.v$.$anyDirty) {
121+
if (
122+
this.$refs.form &&
123+
!this.$refs.form.isFormValid() &&
124+
this.$refs.form.v$.$anyDirty
125+
) {
109126
this.inError = true
110127
} else {
111128
this.inError = false

enterprise/web-frontend/modules/baserow_enterprise/plugin.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -122,8 +122,8 @@ export default defineNuxtPlugin({
122122
new WriteFieldValuesPermissionManagerType(context)
123123
)
124124

125-
$store.registerModule('authProviderAdmin', authProviderAdminStore)
126-
$store.registerModule('assistant', assistantStore)
125+
$store.registerModuleNuxtSafe('authProviderAdmin', authProviderAdminStore)
126+
$store.registerModuleNuxtSafe('assistant', assistantStore)
127127

128128
$registry.register('admin', new AuthProvidersType(context))
129129
$registry.unregister(

premium/web-frontend/modules/baserow_premium/plugin.js

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -136,14 +136,14 @@ export default defineNuxtPlugin({
136136
i18n.mergeLocaleMessage('ko', ko)
137137
}*/
138138

139-
$store.registerModule('row_comments', rowCommentsStore)
140-
$store.registerModule('page/view/kanban', kanbanStore)
141-
$store.registerModule('page/view/calendar', calendarStore)
142-
$store.registerModule('page/view/timeline', timelineStore)
143-
$store.registerModule('template/view/kanban', kanbanStore)
144-
$store.registerModule('template/view/calendar', calendarStore)
145-
$store.registerModule('template/view/timeline', timelineStore)
146-
$store.registerModule('impersonating', impersonatingStore)
139+
$store.registerModuleNuxtSafe('row_comments', rowCommentsStore)
140+
$store.registerModuleNuxtSafe('page/view/kanban', kanbanStore)
141+
$store.registerModuleNuxtSafe('page/view/calendar', calendarStore)
142+
$store.registerModuleNuxtSafe('page/view/timeline', timelineStore)
143+
$store.registerModuleNuxtSafe('template/view/kanban', kanbanStore)
144+
$store.registerModuleNuxtSafe('template/view/calendar', calendarStore)
145+
$store.registerModuleNuxtSafe('template/view/timeline', timelineStore)
146+
$store.registerModuleNuxtSafe('impersonating', impersonatingStore)
147147

148148
$registry.registerNamespace('aiFieldOutputType')
149149
$registry.registerNamespace('paidFeature')

web-frontend/modules/automation/plugin.js

Lines changed: 11 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -58,11 +58,17 @@ export default defineNuxtPlugin({
5858
)
5959

6060
// Register stores
61-
$store.registerModule('automationApplication', automationApplicationStore)
62-
$store.registerModule('automationWorkflow', automationWorkflowStore)
63-
$store.registerModule('automationWorkflowNode', automationWorkflowNodeStore)
64-
$store.registerModule('automationHistory', automationHistoryStore)
65-
$store.registerModule(
61+
$store.registerModuleNuxtSafe(
62+
'automationApplication',
63+
automationApplicationStore
64+
)
65+
$store.registerModuleNuxtSafe('automationWorkflow', automationWorkflowStore)
66+
$store.registerModuleNuxtSafe(
67+
'automationWorkflowNode',
68+
automationWorkflowNodeStore
69+
)
70+
$store.registerModuleNuxtSafe('automationHistory', automationHistoryStore)
71+
$store.registerModuleNuxtSafe(
6672
'template/automationApplication',
6773
automationApplicationStore
6874
)

0 commit comments

Comments
 (0)