vscode extension sometimes adds multiple annotations to machine #274
Comments
|
I have this same issue, also not sure what causes this. |
|
If you could come up with repro steps - that would be immensely helpful in fixing this. |
|
I have a hunch that it has to do with the indentation of the first |
|
I think that it's likely that you had some other error before this happened, something failed to sync properly and impacted future sync - causing the duplicate layout strings to be inserted. |
|
@viglucci @JoepKockelkorn could you try the newest version of the VS Code extension? Does the problem persist? |
|
I just tried on version
So there are actually two bugs happening at the same time:
I see these errors coming by in the Extension Host logs: Here is my machine code (imports + typings omitted): export const signUpMachine = createMachine({
id: 'SignUp',
tsTypes: {} as import('./sign-up.machine.typegen').Typegen0,
initial: 'selectPriceplan',
states: {
registered: {
entry: 'cleanLocalStorage',
type: 'final',
meta: { step: 4 },
},
checkingPaymentStatus: {
after: {
'60000': {
target: 'checkPaymentFailed',
actions: [],
internal: false,
},
},
initial: 'loading',
states: {
loading: {
invoke: {
src: 'checkStatus',
onDone: [
{
target: '#SignUp.checkingRegistrationStatus',
cond: 'paid',
actions: ['saveStatus', 'resetRetryAttempts'],
},
{
target: 'waiting',
actions: 'incrementAttempts',
},
],
onError: [
{
target: '#SignUp.workflowNotFound',
cond: 'not found',
},
{
target: '#SignUp.checkPaymentFailed',
},
],
},
},
waiting: {
after: {
DELAY_WITH_BACKOFF: {
target: '#SignUp.checkingPaymentStatus.loading',
actions: [],
internal: false,
},
},
},
},
meta: { step: 4, loading: true },
},
checkPaymentFailed: {
type: 'final',
meta: { step: 4 },
},
loadingCheckoutUrl: {
invoke: {
src: 'loadCheckoutUrl',
onDone: [
{
target: 'loadCheckoutUrlSuccess',
actions: 'saveCheckoutUrl',
},
],
onError: [
{
target: 'loadCheckoutUrlFailed',
},
],
},
meta: { step: 3, loading: true },
},
loadCheckoutUrlSuccess: {
type: 'final',
meta: { step: 3 },
},
loadCheckoutUrlFailed: {
type: 'final',
meta: { step: 3 },
},
enterUserRegistration: {
description: "If existingUser then don't show password fields and terms.",
always: {
target: 'enterEmailCodes',
cond: 'registrationRequested',
},
on: {
'submit.userRegistration': {
target: 'checkingUserRegistration',
actions: 'storeEnteredPersonalDetails',
},
},
meta: { step: 1 },
},
enterEmailCodes: {
always: [
{
target: 'checkingRegistrationStatus',
cond: 'emailAddressesVerified and (payment not required or paid)',
},
{
target: 'checkingPaymentStatus',
cond: 'emailAddressesVerified, paymentRequired and checkout done but not paid',
actions: 'resetRetryAttempts',
},
{
target: 'loadingCheckoutUrl',
cond: 'emailAddressVerified, paymentRequired but not checkout done and not paid',
},
],
on: {
'submit.emailCodes': {
target: 'checkingEmailCodes',
},
},
meta: { step: 2 },
},
checkingEmailCodes: {
invoke: {
src: 'checkEmailCodes',
onDone: [
{
target: 'enterEmailCodes',
cond: 'codes invalid',
actions: 'saveVerifyEmailCodeResponse',
},
{
target: 'loadingCheckoutUrl',
cond: 'payment required',
},
{
target: 'checkingRegistrationStatus',
},
],
onError: [
{
target: 'enterEmailCodes',
actions: 'showErrorInDialog',
},
],
},
meta: { step: 2, loading: true },
},
checkingUserRegistration: {
invoke: {
src: 'checkUserRegistration',
onDone: [
{
target: 'enterEmailCodes',
actions: 'storeRegisterCustomerResponse',
},
],
onError: [
{
target: 'enterUserRegistration',
actions: 'showErrorInDialog',
},
],
},
meta: { step: 1, loading: true },
},
selectPriceplan: {
always: [
{
target: 'enterUserRegistration',
cond: 'priceplan selected',
},
{
target: 'enterUserRegistration',
cond: 'only one free priceplan available',
actions: 'preselectPriceplan',
},
],
on: {
'select.pricePlan': {
target: 'enterUserRegistration',
actions: 'storePriceplan',
},
},
},
checkingRegistrationStatus: {
after: {
'60000': {
target: 'checkRegistrationFailed',
actions: [],
internal: false,
},
},
initial: 'loading',
states: {
loading: {
invoke: {
src: 'checkStatus',
onDone: [
{
target: 'waiting',
actions: ['saveStatus', 'incrementAttempts'],
},
],
onError: [
{
target: '#SignUp.workflowNotFound',
cond: 'not found',
},
{
target: '#SignUp.checkRegistrationFailed',
},
],
},
},
waiting: {
after: {
DELAY_WITH_BACKOFF: {
target: '#SignUp.checkingRegistrationStatus.loading',
actions: [],
internal: false,
},
},
},
},
meta: { step: 4, loading: true },
},
checkRegistrationFailed: {
type: 'final',
meta: { step: 4 },
},
workflowNotFound: {
entry: ['cleanLocalStorage', 'redirectToSignUpOops'],
type: 'final',
},
},
always: [
{
target: 'registered',
cond: 'registered',
},
],
schema: {
context: {} as SignUpContext,
events: {} as
| { type: 'startPayment' }
| { type: 'submit.emailCodes'; request: VerifyEmailCodeRequest }
| { type: 'submit.userRegistration'; request: RegisterCustomerRequest }
| { type: 'select.pricePlan'; price: Price },
services: {} as {
checkStatus: { data: CheckStatusResponse };
checkUserRegistration: { data: RegisterCustomerResponse };
checkEmailCodes: { data: VerifyEmailCodeResponse };
loadCheckoutUrl: { data: GetCheckoutUrlResponse };
},
},
context: { checkoutComplete: false },
predictableActionArguments: true,
preserveActionOrder: true,
}); |
|
@JoepKockelkorn thank you for all of this detail! However, I fail to reproduce this with the given steps. The state is being added correctly - maybe it depends on where we add it (?). I'm also a little bit confused by one of the last steps in which you remove a new state. If you added a new state, it didn't pop up in the code, and then if you reopened the Visual Editor... there should be a new state there (since it didn't get synced to the code before). |
|
Yes, indeed the new state was only in the visual, not in the code. So that's where I removed it. As soon as I removed it, the second metadata comment was created. The way I added the new state was double clicking anywhere in the machine. So there wasn't any way to get in that state, but it should have been created anyway, right? But I think it doesn't matter what change I make to the machine, it fails in updating the machine right away. This is using the exact same machine code as above:
|
|
This happens pretty frequently for me. The larger and more complicated the state gets, the more likely that some change will cause a duplication of Some error messages I've seen outputted from the extension that cause this issue: |
|
Similarly I have issues with the editor syncing, to the point where it makes it untenable for me to introduce xstate to my team. If there's an error with syncing, the editor should fail fast and obvious so the user does not continue inputting work that cannot be recovered. |
Thanks for the feedback, I agree. We're prioritizing the syncing issues with the extension (not the easiest problem to solve 😅) |
Description
The VSCode extension sometimes adds multiple annotations to a machine definition. I'm not entirely sure what behavior or steps I am taking that might be causing this to happen.
Each added annotation has different data and is a different length.
Environment
XState VSCode version: v1.11.0
The text was updated successfully, but these errors were encountered: