Skip to content

Commit

Permalink
fix: P in P (#1999)
Browse files Browse the repository at this point in the history
* chore: use Node 20.11.1
* fix: use a span instead of p for Notification subtitles

Our apps render markdown for notifications which contain p tags. This
results in p tags nested within p tags, which is not valid HTML and
causes React runtime validations to complain.
  • Loading branch information
ahuth authored Jun 24, 2024
1 parent 4dc57db commit 7566e2c
Show file tree
Hide file tree
Showing 3 changed files with 14 additions and 14 deletions.
2 changes: 1 addition & 1 deletion .node-version
Original file line number Diff line number Diff line change
@@ -1 +1 @@
20.9.0
20.11.1
2 changes: 1 addition & 1 deletion src/components/AppNotification/AppNotification.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -66,7 +66,7 @@ export const AppNotification = ({
{title}
</Text>
<Text
as="p"
as="span"
className={styles['app-notification__sub-title']}
preset="body-md"
>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -14,11 +14,11 @@ exports[`<AppNotification /> Default story renders snapshot 1`] = `
>
This is an AppNotification title
</div>
<p
<span
class="text text--body-md app-notification__sub-title"
>
Lorem ipsum dolor sit amet consectetur. At et vitae quis amet felis mollis in vitae. Eget in neque et molestie. Luctus sed id commodo volutpat. In a eu in id molestie consectetur pellentesque.
</p>
</span>
<div
class="app-notification__actions"
/>
Expand All @@ -41,11 +41,11 @@ exports[`<AppNotification /> LightColor story renders snapshot 1`] = `
>
This is an AppNotification title
</div>
<p
<span
class="text text--body-md app-notification__sub-title"
>
Lorem ipsum dolor sit amet consectetur. At et vitae quis amet felis mollis in vitae. Eget in neque et molestie. Luctus sed id commodo volutpat. In a eu in id molestie consectetur pellentesque.
</p>
</span>
<div
class="app-notification__actions"
>
Expand Down Expand Up @@ -93,11 +93,11 @@ exports[`<AppNotification /> LightWithDismissAndControls story renders snapshot
>
This is an AppNotification title
</div>
<p
<span
class="text text--body-md app-notification__sub-title"
>
Lorem ipsum dolor sit amet consectetur. At et vitae quis amet felis mollis in vitae. Eget in neque et molestie. Luctus sed id commodo volutpat. In a eu in id molestie consectetur pellentesque.
</p>
</span>
<div
class="app-notification__actions"
>
Expand Down Expand Up @@ -169,11 +169,11 @@ exports[`<AppNotification /> WithControls story renders snapshot 1`] = `
>
This is an AppNotification title
</div>
<p
<span
class="text text--body-md app-notification__sub-title"
>
Lorem ipsum dolor sit amet consectetur. At et vitae quis amet felis mollis in vitae. Eget in neque et molestie. Luctus sed id commodo volutpat. In a eu in id molestie consectetur pellentesque.
</p>
</span>
<div
class="app-notification__actions"
>
Expand Down Expand Up @@ -221,11 +221,11 @@ exports[`<AppNotification /> WithDismissAndControls story renders snapshot 1`] =
>
This is an AppNotification title
</div>
<p
<span
class="text text--body-md app-notification__sub-title"
>
Limited subtitle text
</p>
</span>
<div
class="app-notification__actions"
>
Expand Down Expand Up @@ -297,7 +297,7 @@ exports[`<AppNotification /> WithLinkInSubtitle story renders snapshot 1`] = `
>
This is an AppNotification title
</div>
<p
<span
class="text text--body-md app-notification__sub-title"
>
<span
Expand All @@ -314,7 +314,7 @@ exports[`<AppNotification /> WithLinkInSubtitle story renders snapshot 1`] = `
in.
</span>
</p>
</span>
<div
class="app-notification__actions"
/>
Expand Down

0 comments on commit 7566e2c

Please sign in to comment.