`action$` never `isPending`
Which component is affected?
Qwik City
Describe the bug
Hi!
I'm playing with action$s and am finding that my action is never marked as isPending, so I can't handle loading states in my UI. I see { isPending: false} on both the server and client, but never { isPending: true }. Am I missing something?
Reproduction
https://stackblitz.com/edit/qwik-starter-vzcxmh?file=src%2Froutes%2Findex.tsx
Steps to reproduce
- Create an
action$ - Consume it using
action.use() - Pass it to a
Formcomponent as theactionprop - Submit the form
- Verify
action.isPendingis nevertrue
System Info
System:
OS: macOS 13.1
CPU: (8) arm64 Apple M1 Pro
Memory: 115.00 MB / 16.00 GB
Shell: 5.8.1 - /bin/zsh
Binaries:
Node: 18.12.1 - ~/Library/Caches/fnm_multishells/1580_1673551656097/bin/node
Yarn: 1.22.19 - /opt/homebrew/bin/yarn
npm: 8.19.2 - ~/Library/Caches/fnm_multishells/1580_1673551656097/bin/npm
Browsers:
Brave Browser: 97.1.34.81
Firefox: 100.0
Safari: 16.2
npmPackages:
@builder.io/qwik: 0.16.2 => 0.16.2
@builder.io/qwik-city: 0.1.0-beta9 => 0.1.0-beta9
undici: 5.15.0 => 5.15.0
vite: 4.0.4 => 4.0.4
Additional Information
it works the same way in the testing playgorund: https://github.com/BuilderIO/qwik/blob/ba09db947c8772643d7237fae13deba6f7fb1703/starters/apps/qwikcity-test/src/routes/(common)/actions/index.tsx#L66
I added the following:
useClientEffect$((ctx) =>{
const interval = setInterval(() => {
console.log(l, l.isPending)
}, 1000)
ctx.cleanup(() => clearInterval(interval))
})
To the repro case above, and the logging shows that isPending does become true, so I think the bug is that the component is not rerendered when that happens.
Fixed by https://github.com/BuilderIO/qwik/commit/aad7742d631c6e758d56c1ee94cd28881a00c73b
Thanks a lot for the issue report!