fix: embed non-transparent dark background on success page#9085
fix: embed non-transparent dark background on success page#9085
Conversation
CAL-1752 Dark instead of transparent background on success page in embed.
It would look really bad in an inline embed. |
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
1 Ignored Deployment
|
| name="embed" | ||
| clearQueryParamsOnClose={queryParamsForDialog} | ||
| onOpenChange={(open) => { | ||
| if (!open) window.resetEmbedStatus(); |
There was a problem hiding this comment.
resetEmbedStatus is not needed now as we haven't been using sessionStorage to detect embed mode. As sessionStorage was common for Embed Code Generator preview window and the app, it was to remove the side effect.
| const embedNamespace = | ||
| typeof embedNameSpaceFromQueryParam === "string" | ||
| ? embedNameSpaceFromQueryParam | ||
| : window.name.replace(/cal-embed=(.*)/, "$1").trim(); |
There was a problem hiding this comment.
Updated window.name to have namespace as well.
It is set here https://github.com/calcom/cal.com/pull/9085/files#diff-e895c26df52266ecfd6334060b1dc6fa05cac4106eee7f713d0a07472cc08d07R218
| const url = new URL(document.URL); | ||
| const namespace = url.searchParams.get("embed"); | ||
| return namespace; | ||
| return embedNamespace; |
There was a problem hiding this comment.
Now namespace and embed mode are both derives from the same variable.
|
|
||
| const searchParams = new URL(document.URL).searchParams; | ||
| const only = window.only; | ||
| const only = searchParams.get("only"); |
There was a problem hiding this comment.
Get only param from here directly instead of relying on window.only which is set by playground index.html
| embedInit(); | ||
| const url = new URL(document.URL); | ||
| embedStore.theme = window?.getEmbedTheme?.() as UiConfig["theme"]; | ||
| embedStore.theme = window?.getEmbedTheme?.(); |
There was a problem hiding this comment.
Remove type assertion.
| hideEventTypeDetails?: boolean; | ||
| theme?: EmbedThemeConfig; | ||
| // If theme not provided we would get null | ||
| theme?: EmbedThemeConfig | null; |
There was a problem hiding this comment.
After type assertion was removed, it was found out that it should have null also as it's possible value
d1ea3ad to
64037b4
Compare
📦 Next.js Bundle Analysis for @calcom/webThis analysis was generated by the Next.js Bundle Analysis action. 🤖 Nine Pages Changed SizeThe following pages changed size from the code in this PR compared to its base branch:
DetailsOnly the gzipped size is provided here based on an expert tip. First Load is the size of the global bundle plus the bundle for the individual page. If a user were to show up to your website and land on a given page, the first load size represents the amount of javascript that user would need to download. If Any third party scripts you have added directly to your app using the The "Budget %" column shows what percentage of your performance budget the First Load total takes up. For example, if your budget was 100kb, and a given page's first load size was 10kb, it would be 10% of your budget. You can also see how much this has increased or decreased compared to the base branch of your PR. If this percentage has increased by 20% or more, there will be a red status indicator applied, indicating that special attention should be given to this. If you see "+/- <0.01%" it means that there was a change in bundle size, but it is a trivial enough amount that it can be ignored. |
Current Playwright Test Results Summary✅ 106 Passing - ❌ 1 Failing - Run may still be in progress, this comment will be updated as current testing workflow or job completes... (Last updated on 06/06/2023 11:50:44pm UTC) Run DetailsRunning Workflow PR Update on Github Actions Commit: fddacc5 Started: 06/06/2023 11:49:05pm UTC ❌ Failures📄 packages/embeds/embed-core/playwright/tests/action-based.e2e.ts • 1 FailureTest Case Results
|
| Test Case | Last 7 days Failures | Last 7 days Flakes |
|---|---|---|
|
Reschedule for booking with seats -- old-booker Should reschedule booking with seats and if everyone rescheduled it should be deleted
Retry 1 • Initial Attempt |
1.49% (6)6 / 402 runsfailed over last 7 days |
11.19% (45)45 / 402 runsflaked over last 7 days |
What does this PR do?
Makes sure that embed is detected correctly on success page which would automatically remove color-scheme dark on that page.
Also, fixes a possible case of theme flicker.
Fixes #9084
Fixes #9173
Loom for bug demo
Type of change
How should this be tested?
See loom
Followup
Checklist