Skip to content
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.

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

Already on GitHub? Sign in to your account

Nested template literals #966

Open
1 task
T1xx1 opened this issue Feb 8, 2024 · 1 comment
Open
1 task

Nested template literals #966

T1xx1 opened this issue Feb 8, 2024 · 1 comment
Labels
- P3: minor bug An edge case that only affects very specific usage (priority)

Comments

@T1xx1
Copy link

T1xx1 commented Feb 8, 2024

Astro Info

Astro                    v4.3.5
Node                     v21.6.1
System                   Windows (x64)
Package Manager          npm
Output                   static
Adapter                  @astrojs/vercel
Integrations             @astrojs/svelte
                         @astrojs/tailwind

If this issue only occurs in one browser, which browser is a problem?

No response

Describe the Bug

Using nested template literals throws an error of expected ")" on a line not present in the file.

Syntax highlighting doesn't show any errors.

<a
   href={social.link}
   class=`${type === 'CARD' && `${social.style} block rounded-lg px-4 py-3 w-fit flex gap-2 items-center`} ${styles}`
>
   <img src={social.icon.src} alt={social.name} class="aspect-square h-5" />
   {type === "CARD" && <div>{social.name}</div>}
</a>

The class attr seems to trigger the error.
Err on line 91 but there are only 73 in my component (see Stackblitz).

Wrapping the class with { } fixes the problem.

What's the expected result?

Work with nested template literals without wrapping between { } as non-nested template literals work fine without brackets.

Link to Minimal Reproducible Example

https://stackblitz.com/edit/withastro-astro-1hn7ch?file=src%2Fcomponents%2Fsocial.astro

Participation

  • I am willing to submit a pull request for this issue.
@github-actions github-actions bot added the needs triage Issue needs to be triaged label Feb 8, 2024
@Princesseuh Princesseuh transferred this issue from withastro/astro Feb 8, 2024
@Princesseuh
Copy link
Member

Seems related to #934, though that one was in the frontmatter.

@Princesseuh Princesseuh added - P3: minor bug An edge case that only affects very specific usage (priority) and removed needs triage Issue needs to be triaged labels Feb 8, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
- P3: minor bug An edge case that only affects very specific usage (priority)
Projects
None yet
Development

No branches or pull requests

2 participants