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

After successful submission if the user checks/submits another, the previous success message isn't cleared #16

Open
C-Loftus opened this issue Aug 7, 2024 · 0 comments
Labels
bug Something isn't working

Comments

@C-Loftus
Copy link
Member

C-Loftus commented Aug 7, 2024

The success message should not linger after the user uploads a new CSV. However, it does. To reproduce this, submit a CSV, then upload another. Then upload another to check. The success message will not be cleared.

I am unclear why this is the case. Tried a lot of things to debug this but the stack trace in the debugger seems to say this is a Vue internals bug. Not sure what is wrong.

image

image

[vite] connecting... client:495:8
[vite] connected. client:614:14
Sending to API: webb-ben/geoconnex.us upload.ts:20:8
Source map error: No sources are declared in this source map.
Resource URL: http://localhost:5173/node_modules/.vite/deps/vue.js?v=6b938496
Source Map URL: vue.js.map
Source map error: No sources are declared in this source map.
Resource URL: http://localhost:5173/node_modules/.vite/deps/chunk-S3XCI6LX.js?v=6b938496
Source Map URL: chunk-S3XCI6LX.js.map
[Vue warn]: Invalid prop: custom validator check failed for prop "variant". 
  at <VBtn class="flex ma-2" target="_blank" variant="test"  ... > 
  at <VCardText class="markdown-card-text text-center pa-0 ma-0" > 
  at <BaseTransition onBeforeEnter=fn<onBeforeEnter> onEnter=fn onAfterEnter=fn<resetStyles>  ... > 
  at <Transition name="expand-transition" css=true onBeforeEnter=fn<onBeforeEnter>  ... > 
  at <ExpandTransition onAfterLeave=fn<onAfterLeave> > 
  at <VExpansionPanelText class="expansion-panel text-1b335f" > 
  at <VDefaultsProvider defaults= 
Object { VExpansionPanelTitle: {…}, VExpansionPanelText: {…} }
 > 
  at <VExpansionPanel title="CSV Formatting Information" bg-color="#f4f4f9" > 
  at <VExpansionPanels class="contribution-button mb-5" > 
  at <VCol cols="12" > 
  at <VRow> 
  at <VContainer class="form-content" > 
  at <VForm id="uploadForm" onSubmit=fn class="form-container" > 
  at <VCol cols="12" sm="8" > 
  at <VRow justify="center" > 
  at <VContainer class="fill-height" fluid="" > 
  at <UploadForm> 
  at <App> runtime-core.esm-bundler.js:48:12
[Vue warn]: Invalid prop: custom validator check failed for prop "variant". 
  at <VBtn class="flex ma-2" target="_blank" variant="test"  ... > 
  at <VCardText class="markdown-card-text text-center pa-0 ma-0" > 
  at <BaseTransition onBeforeEnter=fn<onBeforeEnter> onEnter=fn onAfterEnter=fn<resetStyles>  ... > 
  at <Transition name="expand-transition" css=true onBeforeEnter=fn<onBeforeEnter>  ... > 
  at <ExpandTransition onAfterLeave=fn<onAfterLeave> > 
  at <VExpansionPanelText class="expansion-panel text-1b335f" > 
  at <VDefaultsProvider defaults= 
Object { VExpansionPanelTitle: {…}, VExpansionPanelText: {…} }
 > 
  at <VExpansionPanel title="CSV Formatting Information" bg-color="#f4f4f9" > 
  at <VExpansionPanels class="contribution-button mb-5" > 
  at <VCol cols="12" > 
  at <VRow> 
  at <VContainer class="form-content" > 
  at <VForm id="uploadForm" onSubmit=fn class="form-container" > 
  at <VCol cols="12" sm="8" > 
  at <VRow justify="center" > 
  at <VContainer class="fill-height" fluid="" > 
  at <UploadForm> 
  at <App> runtime-core.esm-bundler.js:48:12
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://internetofwater.org/sites/1. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing). Status code: 301.
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://internetofwater.org/sites/1. (Reason: CORS request did not succeed). Status code: (null).
XHRGET
https://api.github.com/repos/webb-ben/geoconnex.us/contents/namespaces/test5/validExample.csv?ref=master
[HTTP/2 404  84ms]

[Vue warn]: Invalid prop: type check failed for prop "text". Expected String with value "[object Object]", got Object  
  at <VAlert key=0 color="success" icon="$success"  ... > 
  at <VForm id="uploadForm" onSubmit=fn class="form-container" > 
  at <VCol cols="12" sm="8" > 
  at <VRow justify="center" > 
  at <VContainer class="fill-height" fluid="" > 
  at <UploadForm> 
  at <App> runtime-core.esm-bundler.js:48:12
[Vue warn]: Invalid VNode type: undefined (undefined) 
  at <VAlert key=0 color="success" icon="$success"  ... > 
  at <VForm id="uploadForm" onSubmit=fn class="form-container" > 
  at <VCol cols="12" sm="8" > 
  at <VRow justify="center" > 
  at <VContainer class="fill-height" fluid="" > 
  at <UploadForm> 
  at <App> runtime-core.esm-bundler.js:48:12
[Vue warn]: Unhandled error during execution of scheduler flush. This is likely a Vue internals bug. Please open an issue at https://github.com/vuejs/core . 
  at <VForm id="uploadForm" onSubmit=fn class="form-container" > 
  at <VCol cols="12" sm="8" > 
  at <VRow justify="center" > 
  at <VContainer class="fill-height" fluid="" > 
  at <UploadForm> 
  at <App> runtime-core.esm-bundler.js:48:12
Uncaught (in promise) TypeError: i.type is undefined
    isAsyncWrapper runtime-core.esm-bundler.js:1953
    unmount runtime-core.esm-bundler.js:5647
    unmountChildren runtime-core.esm-bundler.js:5773
    unmount runtime-core.esm-bundler.js:5680
    unmountChildren runtime-core.esm-bundler.js:5773
    unmount runtime-core.esm-bundler.js:5680
    unmountComponent runtime-core.esm-bundler.js:5753
    unmount runtime-core.esm-bundler.js:5653
    patchKeyedChildren runtime-core.esm-bundler.js:5520
    patchChildren runtime-core.esm-bundler.js:5331
    processFragment runtime-core.esm-bundler.js:4970
    patch runtime-core.esm-bundler.js:4442
    patchKeyedChildren runtime-core.esm-bundler.js:5417
    patchChildren runtime-core.esm-bundler.js:5331
    patchElement runtime-core.esm-bundler.js:4760
    processElement runtime-core.esm-bundler.js:4599
    patch runtime-core.esm-bundler.js:4456
    componentUpdateFn runtime-core.esm-bundler.js:5220
    run reactivity.esm-bundler.js:177
    update runtime-core.esm-bundler.js:5264
    callWithErrorHandling runtime-core.esm-bundler.js:195
    flushJobs runtime-core.esm-bundler.js:409
    promise callback*queueFlush runtime-core.esm-bundler.js:319
    queueJob runtime-core.esm-bundler.js:313
    effect runtime-core.esm-bundler.js:5258
    resetScheduling reactivity.esm-bundler.js:262
    trigger reactivity.esm-bundler.js:402
    set reactivity.esm-bundler.js:524
    set runtime-core.esm-bundler.js:2272
    checkValid UploadForm.vue:249
    callWithErrorHandling runtime-core.esm-bundler.js:195
    callWithAsyncErrorHandling runtime-core.esm-bundler.js:202
    invoker runtime-dom.esm-bundler.js:693
    addEventListener runtime-dom.esm-bundler.js:644
    patchEvent runtime-dom.esm-bundler.js:662
    patchProp runtime-dom.esm-bundler.js:739
    mountElement runtime-core.esm-bundler.js:4641
    processElement runtime-core.esm-bundler.js:4588
    patch runtime-core.esm-bundler.js:4456
    componentUpdateFn runtime-core.esm-bundler.js:5140
    run reactivity.esm-bundler.js:177
    update runtime-core.esm-bundler.js:5264
    setupRenderEffect runtime-core.esm-bundler.js:5274
    mountComponent runtime-core.esm-bundler.js:5042
    processComponent runtime-core.esm-bundler.js:4996
    patch runtime-core.esm-bundler.js:4468
    componentUpdateFn runtime-core.esm-bundler.js:5140
    run reactivity.esm-bundler.js:177
    update runtime-core.esm-bundler.js:5264
    setupRenderEffect runtime-core.esm-bundler.js:5274
    mountComponent runtime-core.esm-bundler.js:5042
    processComponent runtime-core.esm-bundler.js:4996
    patch runtime-core.esm-bundler.js:4468
    mountChildren runtime-core.esm-bundler.js:4710
    mountElement runtime-core.esm-bundler.js:4623
    processElement runtime-core.esm-bundler.js:4588
    patch runtime-core.esm-bundler.js:4456
    componentUpdateFn runtime-core.esm-bundler.js:5140
    run reactivity.esm-bundler.js:177
    update runtime-core.esm-bundler.js:5264
    setupRenderEffect runtime-core.esm-bundler.js:5274
    mountComponent runtime-core.esm-bundler.js:5042
    processComponent runtime-core.esm-bundler.js:4996
runtime-core.esm-bundler.js:1953:32
[Vue warn]: Unhandled error during execution of scheduler flush. This is likely a Vue internals bug. Please open an issue at https://github.com/vuejs/core . 
  at <VForm id="uploadForm" onSubmit=fn class="form-container" > 
  at <VCol cols="12" sm="8" > 
  at <VRow justify="center" > 
  at <VContainer class="fill-height" fluid="" > 
  at <UploadForm> 
  at <App> runtime-core.esm-bundler.js:48:12
Uncaught (in promise) TypeError: child is null
    remove runtime-dom.esm-bundler.js:19
    performRemove runtime-core.esm-bundler.js:5714
    remove2 runtime-core.esm-bundler.js:5728
    unmount runtime-core.esm-bundler.js:5683
    patchKeyedChildren runtime-core.esm-bundler.js:5520
    patchChildren runtime-core.esm-bundler.js:5331
    processFragment runtime-core.esm-bundler.js:4970
    patch runtime-core.esm-bundler.js:4442
    patchKeyedChildren runtime-core.esm-bundler.js:5417
    patchChildren runtime-core.esm-bundler.js:5331
    patchElement runtime-core.esm-bundler.js:4760
    processElement runtime-core.esm-bundler.js:4599
    patch runtime-core.esm-bundler.js:4456
    componentUpdateFn runtime-core.esm-bundler.js:5220
    run reactivity.esm-bundler.js:177
    update runtime-core.esm-bundler.js:5264
    callWithErrorHandling runtime-core.esm-bundler.js:195
    flushJobs runtime-core.esm-bundler.js:409
    promise callback*queueFlush runtime-core.esm-bundler.js:319
    queueJob runtime-core.esm-bundler.js:313
    effect runtime-core.esm-bundler.js:5258
    resetScheduling reactivity.esm-bundler.js:262
    trigger reactivity.esm-bundler.js:402
    set reactivity.esm-bundler.js:524
    set runtime-core.esm-bundler.js:2272
    checkValid UploadForm.vue:278
    callWithErrorHandling runtime-core.esm-bundler.js:195
    callWithAsyncErrorHandling runtime-core.esm-bundler.js:202
    invoker runtime-dom.esm-bundler.js:693
    addEventListener runtime-dom.esm-bundler.js:644
    patchEvent runtime-dom.esm-bundler.js:662
    patchProp runtime-dom.esm-bundler.js:739
    mountElement runtime-core.esm-bundler.js:4641
    processElement runtime-core.esm-bundler.js:4588
    patch runtime-core.esm-bundler.js:4456
    componentUpdateFn runtime-core.esm-bundler.js:5140
    run reactivity.esm-bundler.js:177
    update runtime-core.esm-bundler.js:5264
    setupRenderEffect runtime-core.esm-bundler.js:5274
    mountComponent runtime-core.esm-bundler.js:5042
    processComponent runtime-core.esm-bundler.js:4996
    patch runtime-core.esm-bundler.js:4468
    componentUpdateFn runtime-core.esm-bundler.js:5140
    run reactivity.esm-bundler.js:177
    update runtime-core.esm-bundler.js:5264
    setupRenderEffect runtime-core.esm-bundler.js:5274
    mountComponent runtime-core.esm-bundler.js:5042
    processComponent runtime-core.esm-bundler.js:4996
    patch runtime-core.esm-bundler.js:4468
    mountChildren runtime-core.esm-bundler.js:4710
    mountElement runtime-core.esm-bundler.js:4623
    processElement runtime-core.esm-bundler.js:4588
    patch runtime-core.esm-bundler.js:4456
    componentUpdateFn runtime-core.esm-bundler.js:5140
    run reactivity.esm-bundler.js:177
    update runtime-core.esm-bundler.js:5264
    setupRenderEffect runtime-core.esm-bundler.js:5274
    mountComponent runtime-core.esm-bundler.js:5042
    processComponent runtime-core.esm-bundler.js:4996
runtime-dom.esm-bundler.js:19:19
    logError runtime-core.esm-bundler.js:265
    handleError runtime-core.esm-bundler.js:252
    callWithErrorHandling runtime-core.esm-bundler.js:197
    flushJobs runtime-core.esm-bundler.js:409
    (Async: promise callback)
    queueFlush runtime-core.esm-bundler.js:319
    queueJob runtime-core.esm-bundler.js:313
    effect runtime-core.esm-bundler.js:5258
    resetScheduling reactivity.esm-bundler.js:262
    trigger reactivity.esm-bundler.js:402
    set reactivity.esm-bundler.js:524
    set runtime-core.esm-bundler.js:2272
    checkValid UploadForm.vue:278
    InterpretGeneratorResume self-hosted:1417
    AsyncFunctionNext self-hosted:804
    (Async: async)
    callWithErrorHandling runtime-core.esm-bundler.js:195
    callWithAsyncErrorHandling runtime-core.esm-bundler.js:202
    invoker runtime-dom.esm-bundler.js:693
    (Async: EventListener.handleEvent)
    addEventListener runtime-dom.esm-bundler.js:644
    patchEvent runtime-dom.esm-bundler.js:662
    patchProp runtime-dom.esm-bundler.js:739
    mountElement runtime-core.esm-bundler.js:4641
    processElement runtime-core.esm-bundler.js:4588
    patch runtime-core.esm-bundler.js:4456
    componentUpdateFn runtime-core.esm-bundler.js:5140
    run reactivity.esm-bundler.js:177
    update runtime-core.esm-bundler.js:5264
    setupRenderEffect runtime-core.esm-bundler.js:5274
    mountComponent runtime-core.esm-bundler.js:5042
    processComponent runtime-core.esm-bundler.js:4996
    patch runtime-core.esm-bundler.js:4468
    componentUpdateFn runtime-core.esm-bundler.js:5140
    run reactivity.esm-bundler.js:177
    update runtime-core.esm-bundler.js:5264
    setupRenderEffect runtime-core.esm-bundler.js:5274
    mountComponent runtime-core.esm-bundler.js:5042
    processComponent runtime-core.esm-bundler.js:4996
    patch runtime-core.esm-bundler.js:4468
    mountChildren runtime-core.esm-bundler.js:4710
    mountElement runtime-core.esm-bundler.js:4623
    processElement runtime-core.esm-bundler.js:4588
    patch runtime-core.esm-bundler.js:4456
    componentUpdateFn runtime-core.esm-bundler.js:5140
    run reactivity.esm-bundler.js:177
    update runtime-core.esm-bundler.js:5264
    setupRenderEffect runtime-core.esm-bundler.js:5274
    mountComponent runtime-core.esm-bundler.js:5042
    processComponent runtime-core.esm-bundler.js:4996
[vite] hot updated: /src/components/UploadForm.vue client:223:18
[Vue warn]: Unhandled error during execution of scheduler flush. This is likely a Vue internals bug. Please open an issue at https://github.com/vuejs/core . 
  at <App> runtime-core.esm-bundler.js:48:12
Uncaught (in promise) TypeError: instance is null
    unmountComponent runtime-core.esm-bundler.js:5741
    unmount runtime-core.esm-bundler.js:5653
    unmountChildren runtime-core.esm-bundler.js:5773
    unmount runtime-core.esm-bundler.js:5680
    unmountChildren runtime-core.esm-bundler.js:5773
    unmount runtime-core.esm-bundler.js:5680
    unmountComponent runtime-core.esm-bundler.js:5753
    unmount runtime-core.esm-bundler.js:5653
    unmountChildren runtime-core.esm-bundler.js:5773
    unmount runtime-core.esm-bundler.js:5680
    unmountComponent runtime-core.esm-bundler.js:5753
    unmount runtime-core.esm-bundler.js:5653
    unmountChildren runtime-core.esm-bundler.js:5773
    unmount runtime-core.esm-bundler.js:5680
    unmountComponent runtime-core.esm-bundler.js:5753
    unmount runtime-core.esm-bundler.js:5653
    unmountChildren runtime-core.esm-bundler.js:5773
    unmount runtime-core.esm-bundler.js:5680
    unmountComponent runtime-core.esm-bundler.js:5753
    unmount runtime-core.esm-bundler.js:5653
    unmountComponent runtime-core.esm-bundler.js:5753
    unmount runtime-core.esm-bundler.js:5653
    patch runtime-core.esm-bundler.js:4419
    patchBlockChildren runtime-core.esm-bundler.js:4855
    processFragment runtime-core.esm-bundler.js:4944
    patch runtime-core.esm-bundler.js:4442
    componentUpdateFn runtime-core.esm-bundler.js:5220
    run reactivity.esm-bundler.js:177
    update runtime-core.esm-bundler.js:5264
    reload runtime-core.esm-bundler.js:520
    callWithErrorHandling runtime-core.esm-bundler.js:195
    flushJobs runtime-core.esm-bundler.js:409
    promise callback*queueFlush runtime-core.esm-bundler.js:319
    queueJob runtime-core.esm-bundler.js:313
    reload runtime-core.esm-bundler.js:519
    tryWrap runtime-core.esm-bundler.js:552
    <anonymous> UploadForm.vue:588
    accept client:34
    fetchUpdate client:218
    queueUpdate client:193
    queueUpdate client:193
    handleMessage client:638
    handleMessage client:636
    setupWebSocket client:546
    setupWebSocket client:545
    <anonymous> client:530
runtime-core.esm-bundler.js:5741:53
    logError runtime-core.esm-bundler.js:265
    handleError runtime-core.esm-bundler.js:252
    callWithErrorHandling runtime-core.esm-bundler.js:197
    flushJobs runtime-core.esm-bundler.js:409
    (Async: promise callback)
    queueFlush runtime-core.esm-bundler.js:319
    queueJob runtime-core.esm-bundler.js:313
    reload runtime-core.esm-bundler.js:519
    tryWrap runtime-core.esm-bundler.js:552
    <anonymous> UploadForm.vue:588
    accept client:34
    fetchUpdate client:218
    queueUpdate client:193
    forEach self-hosted:160
    queueUpdate client:193
    InterpretGeneratorResume self-hosted:1417
    AsyncFunctionNext self-hosted:804
    (Async: async)
    handleMessage client:638
    map self-hosted:178
    handleMessage client:636
    setupWebSocket client:546
    (Async: EventListener.handleEvent)
    setupWebSocket client:545
    <anonymous> client:530
[vite] hot updated: /src/components/UploadForm.vue client:223:18

@C-Loftus C-Loftus added the bug Something isn't working label Aug 7, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

1 participant