cloudinary-community / svelte-cloudinary

⚡️ High-performance image delivery and uploading at scale in Svelte powered by Cloudinary.
https://svelte.cloudinary.dev/
MIT License
24 stars 11 forks source link

[Bug] Property 'default 'does not exist on type '{}' when using CldUploadWidget let:open #110

Open Synexcu opened 2 months ago

Synexcu commented 2 months ago

Bug Report

When following the video tutorial at Svelte Cloudinary Upload Widget site, an error occurred in Visual Studio Code with the following:

Property 'default' does not exist on type '{}'.ts(2339)
const open: any

Though the website actually works fine and the code to upload image to cloudinary works perfectly, the code however produces a warning that is shown by the Visual Studio Code.

Is this a regression?

I am not too sure.

Steps To Reproduce the error

Here is the code snippet of my current code:

<script lang="ts">
    import type { PageData } from './$types';
    import { Button } from '$lib/components/ui/button';
    import { Input } from '$lib/components/ui/input'
    import * as Form from '$lib/components/ui/form';
    import SuperDebug, { superForm } from 'sveltekit-superforms';
    import { toast } from 'svelte-sonner';
    import { goto } from '$app/navigation';
    import { formSchema } from './schema';
    import { zodClient } from 'sveltekit-superforms/adapters';
    import FormField from '$lib/components/ui/form/form-field.svelte';
    import { FormInput } from 'lucide-svelte';
    import { CldUploadButton, CldUploadWidget, CldImage, getCldImageUrl } from 'svelte-cloudinary';

const onUpload = (result:any, widget:any) => {
        // onChange(result.info.secure_url);
        if (result.event == "success") {
            info = result.info;
            secure_url = result.info.secure_url
            toast.success('Upload image to CLOUD successful!');
            $formData.link = result.info.secure_url
        } else if (result.event === "error") {
            error = result.error.status
        }
        widget.close()
    };

</script>

. . . .

        <CldUploadWidget uploadPreset={uploadPresetKey} {onUpload} let:open>
            <Button on:click={open}>    
                Upload Test
            </Button>
        </CldUploadWidget>

Expected behaviour

I expected that because of the warning from the Visual Studio Code, the bug makes the actual button not usable, but instead it actually works fine as intended like in the video without any problems. The Visual Studio Code was just showing an error, but the code itself works? I have no idea how that works.

Screenshot or Video Recording

image

Your environment

ghostdevv commented 2 months ago

Unfortunately some types are a little broken in v1. I'm working on v2 at the moment which fixes all of these bugs, so will keep this open for tracking :pray: