I'm new to coding and I have no clue what tiggers this error. I'm using svelte and the VSCode returns no error but the site doesn't load and leaves this error message on the inspect console.
index.mjs:207
Uncaught TypeError: Failed to set the 'value' property on
'HTMLProgressElement': The provided double value is non-finite.
at Object.create [as c] (index.mjs:207)
at create_component (index.mjs:1380)
at Object.create [as c] (progress.svelte:7)
at init (index.mjs:1472)
at new App (App.svelte:6)
at main.js:3
at main.js:
The two files App and Progress goes as follows app:
import { Router, Link, Route } from "svelte-routing";
import Navbar from './template/navbar.svelte';
import Progress from "./template/progress.svelte";
let y
</script>
<svelte:window bind:scrollY = {y}/>
<Navbar></Navbar>
<Progress></Progress>
<div class="main">
</div>
<style>
.main{
margin-top: 125px;
width: 60%;
margin-left: 20%;
margin-right: 20%;
height: 100%;
border: 2px solid black;
background-color: white;
border-radius: 25px;
}
</style>
and Progress:
<script>
import { tweened } from 'svelte/motion';
import { cubicOut } from 'svelte/easing';
let y
const progress = tweened(0, {
duration: 1000,
easing: cubicOut
});
</script>
<svelte:window bind:scrollY={y}/>
<progress value={y/500}></progress>
<style>
progress{
display: block;
position: fixed;
width: 79%;
margin-left: 10%;
margin-right: 10%;
height: 25px;
}
</style>
Sorry if this posts sucks btw. I'm dumb.