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

Progressbar in Svelte version does not show progress value #4183

Closed
space-nuko opened this issue May 31, 2023 · 0 comments
Closed

Progressbar in Svelte version does not show progress value #4183

space-nuko opened this issue May 31, 2023 · 0 comments

Comments

@space-nuko
Copy link

Describe the bug

The Progressbar component in the Svelte version doesn't update correctly. This is because the style applied to the element has an incorrect syntax

$: transformStyle = {
transform: progress ? `translate3d(${-100 + progress}%, 0, 0)` : '',
WebkitTransform: progress ? `translate3d(${-100 + progress}%, 0, 0)` : '',
};

<span style={transformStyle} />

The style prop passed to the span has to be a string, not a JavaScript object

To Reproduce

Steps to reproduce the behavior:

  1. Instantiate Progressbar
  2. Set progress to a number

Expected behavior

Bar should display progress value

Actual Behavior

There is no progress update. In the devtools the style has become [object Object]

<span class="progressbar" data-progress="20"><span style="[object Object]"></span></span>
@space-nuko space-nuko changed the title Progressbar in Svelte version uses incorrect style prop format Progressbar in Svelte version does not show progress value May 31, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant