점이 추가가 안되어요

안녕하세요, 라이프 사이클에서 소스 코드를 따라하던 중, 아무리 토글 버튼을 클릭해도 점이 추가가 안돼서 문의드립니다.

제가 어디서 잘못한 부분이 있는지 소스코드 첨부드립니다. ㅜㅜ

한번만 확인해주시면 감사하겠습니다.

<script>
    import {onMount, onDestroy, beforeUpdate, afterUpdate} from 'svelte'

    let name='Something..'
    let h1
    function moreDot(){
        name +='.'
    }
    beforeUpdate(() =>{
        console.log('beforeUpdate');
        console.log(h1 && h1.innerText);
    })
    afterUpdate(() =>{
        console.log('afterUpdate');
        console.log(h1.innerText);
    })
    onMount(() =>{
        console.log('onMount');
        h1=document.querySelector('h1')
    })
    onDestroy(()=>{
        console.log('onDestroy')
    })
</script>


<h1 on:click={moreDot}>{name}</h1>