Skip to main content
Create new
Introduction
Reactivity
Props
Logic
Events
Bindings
Lifecycle
Stores
Motion
Transitions
Animations
Easing
SVG
Actions
Classes
Component composition
Context API
Special elements
Module context
Debugging
7GUIs
Miscellaneous
App.svelte
<script>
let questions = [
{ id: 1, text: `Where did you go to school?` },
{ id: 2, text: `What is your mother's name?` },
{ id: 3, text: `What is another personal fact that an attacker could easily find with Google?` }
];

let selected = $state();

let answer = $state('');

function handleSubmit(event) {
event.preventDefault();
alert(`answered question ${selected.id} (${selected.text}) with "${answer}"`);
}
</script>

<h2>Insecurity questions</h2>

<form onsubmit={handleSubmit}>
<select bind:value={selected} onchange={() => (answer = '')}>
{#each questions as question}
<option value={question}>
{question.text}
</option>
{/each}
</select>

<input bind:value={answer} />

<button disabled={!answer} type="submit"> Submit </button>
</form>

<p>selected question {selected ? selected.id : '[waiting...]'}</p>

<style>

Error compiling component

WebAssembly.instantiateStreaming(): value type opcode @+13
import 'svelte/internal/disclose-version';
import * as $ from 'svelte/internal/client';

var on_change = (_, answer) => $.set(answer, '');
var root_1 = $.template(`<option> </option>`);
var root = $.template(`<h2>Insecurity questions</h2> <form><select></select> <input class="svelte-14lf6jh"> <button type="submit">Submit</button></form> <p> </p>`, 1);

export default function App($$anchor) {
let questions = [
{ id: 1, text: `Where did you go to school?` },
{ id: 2, text: `What is your mother's name?` },
{
id: 3,
text: `What is another personal fact that an attacker could easily find with Google?`
}
];

let selected = $.state(undefined);
let answer = $.state('');

function handleSubmit(event) {
event.preventDefault();
alert(`answered question ${$.get(selected).id} (${$.get(selected).text}) with "${$.get(answer)}"`);
}

var fragment = root();
var form = $.sibling($.first_child(fragment), 2);
var select = $.child(form);

select.__change = [on_change, answer];

$.each(select, 21, () => questions, $.index, ($$anchor, question) => {
var option = root_1();
var option_value = {};
var text = $.child(option, true);

result = svelte.compile(source, {
generate: ,
});

input.svelte-14lf6jh {
display: block;
width: 500px;
max-width: 100%;
}

		
			
				
  • Root {
    • css: StyleSheet {...}
      • type: "StyleSheet"
      • start: 849
      • end: 930
      • attributes: []
      • children: [...] (1)
        • Rule {...}
          • type: "Rule"
          • prelude: SelectorList {...}
            • type: "SelectorList"
            • start: 858
            • end: 863
            • children: [...] (1)
              • ComplexSelector {...}
                • type: "ComplexSelector"
                • start: 858
                • end: 863
                • children: [...] (1)
                  • RelativeSelector {...}
                    • type: "RelativeSelector"
                    • combinator: null
                    • selectors: [...] (1)
                      • TypeSelector {...}
                        • type: "TypeSelector"
                        • name: "input"
                        • start: 858
                        • end: 863
                        }
                      ]
                    • start: 858
                    • end: 863
                    }
                  ]
                }
              ]
            }
          • block: Block {...}
            • type: "Block"
            • start: 864
            • end: 921
            • children: [...] (3)
              • Declaration {...}
                • type: "Declaration"
                • start: 868
                • end: 882
                • property: "display"
                • value: "block"
                }
              • Declaration {...}
                • type: "Declaration"
                • start: 886
                • end: 898
                • property: "width"
                • value: "500px"
                }
              • Declaration {...}
                • type: "Declaration"
                • start: 902
                • end: 917
                • property: "max-width"
                • value: "100%"
                }
              ]
            }
          • start: 858
          • end: 921
          }
        ]
      • content: {...}
        • start: 856
        • end: 922
        • styles: "\n\tinput {\n\t\tdisplay: block;\n\t\twidth: 500px;\n\t\tmax-width: 100%;\n\t}\n"
        • comment: null
        }
      }
    • js: []
    • start: 439
    • end: 847
    • type: "Root"
    • fragment: Fragment {...}
      • type: "Fragment"
      • nodes: [...] (7)
        • Text {...}
          • type: "Text"
          • start: 437
          • end: 439
          • raw: "\n\n"
          • data: "\n\n"
          }
        • RegularElement {...}
          • type: "RegularElement"
          • start: 439
          • end: 468
          • name: "h2"
          • attributes: []
          • fragment: Fragment {...}
            • type: "Fragment"
            • nodes: [...] (1)
              • Text {...}
                • type: "Text"
                • start: 443
                • end: 463
                • raw: "Insecurity questions"
                • data: "Insecurity questions"
                }
              ]
            }
          }
        • Text {...}
          • type: "Text"
          • start: 468
          • end: 470
          • raw: " "
          • data: " "
          }
        • RegularElement {...}
          • type: "RegularElement"
          • start: 470
          • end: 779
          • name: "form"
          • attributes: [...] (1)
            • Attribute {...}
              • type: "Attribute"
              • start: 476
              • end: 499
              • name: "onsubmit"
              • value: ExpressionTag {...}
                • type: "ExpressionTag"
                • start: 485
                • end: 499
                • expression: Identifier {...}
                  • type: "Identifier"
                  • start: 486
                  • end: 498
                  • loc: {...}
                    • start: {...}
                      • line: 20
                      • column: 16
                      }
                    • end: {...}
                      • line: 20
                      • column: 28
                      }
                    }
                  • name: "handleSubmit"
                  }
                }
              }
            ]
          • fragment: Fragment {...}
            • type: "Fragment"
            • nodes: [...] (7)
              • Text {...}
                • type: "Text"
                • start: 500
                • end: 502
                • raw: "\n\t"
                • data: "\n\t"
                }
              • RegularElement {...}
                • type: "RegularElement"
                • start: 502
                • end: 678
                • name: "select"
                • attributes: [...] (2)
                  • BindDirective {...}
                    • start: 510
                    • end: 531
                    • type: "BindDirective"
                    • name: "value"
                    • expression: Identifier {...}
                      • type: "Identifier"
                      • start: 522
                      • end: 530
                      • loc: {...}
                        • start: {...}
                          • line: 21
                          • column: 21
                          }
                        • end: {...}
                          • line: 21
                          • column: 29
                          }
                        }
                      • name: "selected"
                      }
                    • modifiers: []
                    }
                  • Attribute {...}
                    • type: "Attribute"
                    • start: 532
                    • end: 562
                    • name: "onchange"
                    • value: ExpressionTag {...}
                      • type: "ExpressionTag"
                      • start: 541
                      • end: 562
                      • expression: ArrowFunctionExpression {...}
                        • type: "ArrowFunctionExpression"
                        • start: 542
                        • end: 561
                        • loc: {...}
                          • start: {...}
                            • line: 21
                            • column: 41
                            }
                          • end: {...}
                            • line: 21
                            • column: 60
                            }
                          }
                        • id: null
                        • expression: true
                        • generator: false
                        • async: false
                        • params: []
                        • body: AssignmentExpression {...}
                          • type: "AssignmentExpression"
                          • start: 549
                          • end: 560
                          • loc: {...}
                            • start: {...}
                              • line: 21
                              • column: 48
                              }
                            • end: {...}
                              • line: 21
                              • column: 59
                              }
                            }
                          • operator: "="
                          • left: Identifier {...}
                            • type: "Identifier"
                            • start: 549
                            • end: 555
                            • loc: {...}
                              • start: {...}
                                • line: 21
                                • column: 48
                                }
                              • end: {...}
                                • line: 21
                                • column: 54
                                }
                              }
                            • name: "answer"
                            }
                          • right: Literal {...}
                            • type: "Literal"
                            • start: 558
                            • end: 560
                            • loc: {...}
                              • start: {...}
                                • line: 21
                                • column: 57
                                }
                              • end: {...}
                                • line: 21
                                • column: 59
                                }
                              }
                            • value: ""
                            • raw: "''"
                            }
                          }
                        }
                      }
                    }
                  ]
                • fragment: Fragment {...}
                  • type: "Fragment"
                  • nodes: [...] (3)
                    • Text {...}
                      • type: "Text"
                      • start: 563
                      • end: 566
                      • raw: "\n\t\t"
                      • data: "\n\t\t"
                      }
                    • EachBlock {...}
                      • type: "EachBlock"
                      • start: 566
                      • end: 667
                      • expression: Identifier {...}
                        • type: "Identifier"
                        • start: 573
                        • end: 582
                        • loc: {...}
                          • start: {...}
                            • line: 22
                            • column: 9
                            }
                          • end: {...}
                            • line: 22
                            • column: 18
                            }
                          }
                        • name: "questions"
                        }
                      • body: Fragment {...}
                        • type: "Fragment"
                        • nodes: [...] (3)
                          • Text {...}
                            • type: "Text"
                            • start: 595
                            • end: 599
                            • raw: "\n\t\t\t"
                            • data: "\n\t\t\t"
                            }
                          • RegularElement {...}
                            • type: "RegularElement"
                            • start: 599
                            • end: 657
                            • name: "option"
                            • attributes: [...] (1)
                              • Attribute {...}
                                • type: "Attribute"
                                • start: 607
                                • end: 623
                                • name: "value"
                                • value: ExpressionTag {...}
                                  • type: "ExpressionTag"
                                  • start: 613
                                  • end: 623
                                  • expression: Identifier {...}
                                    • type: "Identifier"
                                    • start: 614
                                    • end: 622
                                    • loc: {...}
                                      • start: {...}
                                        • line: 23
                                        • column: 18
                                        }
                                      • end: {...}
                                        • line: 23
                                        • column: 26
                                        }
                                      }
                                    • name: "question"
                                    }
                                  }
                                }
                              ]
                            • fragment: Fragment {...}
                              • type: "Fragment"
                              • nodes: [...] (3)
                                • Text {...}
                                  • type: "Text"
                                  • start: 624
                                  • end: 629
                                  • raw: "\n\t\t\t\t"
                                  • data: "\n\t\t\t\t"
                                  }
                                • ExpressionTag {...}
                                  • type: "ExpressionTag"
                                  • start: 629
                                  • end: 644
                                  • expression: MemberExpression {...}
                                    • type: "MemberExpression"
                                    • start: 630
                                    • end: 643
                                    • loc: {...}
                                      • start: {...}
                                        • line: 24
                                        • column: 5
                                        }
                                      • end: {...}
                                        • line: 24
                                        • column: 18
                                        }
                                      }
                                    • object: Identifier {...}
                                      • type: "Identifier"
                                      • start: 630
                                      • end: 638
                                      • loc: {...}
                                        • start: {...}
                                          • line: 24
                                          • column: 5
                                          }
                                        • end: {...}
                                          • line: 24
                                          • column: 13
                                          }
                                        }
                                      • name: "question"
                                      }
                                    • property: Identifier {...}
                                      • type: "Identifier"
                                      • start: 639
                                      • end: 643
                                      • loc: {...}
                                        • start: {...}
                                          • line: 24
                                          • column: 14
                                          }
                                        • end: {...}
                                          • line: 24
                                          • column: 18
                                          }
                                        }
                                      • name: "text"
                                      }
                                    • computed: false
                                    • optional: false
                                    }
                                  }
                                • Text {...}
                                  • type: "Text"
                                  • start: 644
                                  • end: 648
                                  • raw: "\n\t\t\t"
                                  • data: "\n\t\t\t"
                                  }
                                ]
                              }
                            }
                          • Text {...}
                            • type: "Text"
                            • start: 657
                            • end: 660
                            • raw: "\n\t\t"
                            • data: "\n\t\t"
                            }
                          ]
                        }
                      • context: Identifier {...}
                        • type: "Identifier"
                        • name: "question"
                        • start: 586
                        • loc: {...}
                          • start: {...}
                            • line: 22
                            • column: 22
                            • character: 586
                            }
                          • end: {...}
                            • line: 22
                            • column: 30
                            • character: 594
                            }
                          }
                        • end: 594
                        • typeAnnotation: undefined
                        }
                      • index: undefined
                      • key: undefined
                      }
                    • Text {...}
                      • type: "Text"
                      • start: 667
                      • end: 669
                      • raw: "\n\t"
                      • data: "\n\t"
                      }
                    ]
                  }
                }
              • Text {...}
                • type: "Text"
                • start: 678
                • end: 681
                • raw: " "
                • data: " "
                }
              • RegularElement {...}
                • type: "RegularElement"
                • start: 681
                • end: 710
                • name: "input"
                • attributes: [...] (2)
                  • BindDirective {...}
                    • start: 688
                    • end: 707
                    • type: "BindDirective"
                    • name: "value"
                    • expression: Identifier {...}
                      • type: "Identifier"
                      • start: 700
                      • end: 706
                      • loc: {...}
                        • start: {...}
                          • line: 29
                          • column: 20
                          }
                        • end: {...}
                          • line: 29
                          • column: 26
                          }
                        }
                      • name: "answer"
                      }
                    • modifiers: []
                    }
                  • Attribute {...}
                    • type: "Attribute"
                    • start: -1
                    • end: -1
                    • name: "class"
                    • value: [...] (1)
                      • Text {...}
                        • type: "Text"
                        • data: "svelte-14lf6jh"
                        • raw: "svelte-14lf6jh"
                        • start: -1
                        • end: -1
                        }
                      ]
                    }
                  ]
                • fragment: Fragment {...}
                  • type: "Fragment"
                  • nodes: []
                  }
                }
              • Text {...}
                • type: "Text"
                • start: 710
                • end: 713
                • raw: " "
                • data: " "
                }
              • RegularElement {...}
                • type: "RegularElement"
                • start: 713
                • end: 771
                • name: "button"
                • attributes: [...] (2)
                  • Attribute {...}
                    • type: "Attribute"
                    • start: 721
                    • end: 739
                    • name: "disabled"
                    • value: ExpressionTag {...}
                      • type: "ExpressionTag"
                      • start: 730
                      • end: 739
                      • expression: UnaryExpression {...}
                        • type: "UnaryExpression"
                        • start: 731
                        • end: 738
                        • loc: {...}
                          • start: {...}
                            • line: 31
                            • column: 19
                            }
                          • end: {...}
                            • line: 31
                            • column: 26
                            }
                          }
                        • operator: "!"
                        • prefix: true
                        • argument: Identifier {...}
                          • type: "Identifier"
                          • start: 732
                          • end: 738
                          • loc: {...}
                            • start: {...}
                              • line: 31
                              • column: 20
                              }
                            • end: {...}
                              • line: 31
                              • column: 26
                              }
                            }
                          • name: "answer"
                          }
                        }
                      }
                    }
                  • Attribute {...}
                    • type: "Attribute"
                    • start: 740
                    • end: 753
                    • name: "type"
                    • value: [...] (1)
                      • Text {...}
                        • start: 746
                        • end: 752
                        • type: "Text"
                        • raw: "submit"
                        • data: "submit"
                        }
                      ]
                    }
                  ]
                • fragment: Fragment {...}
                  • type: "Fragment"
                  • nodes: [...] (1)
                    • Text {...}
                      • type: "Text"
                      • start: 754
                      • end: 762
                      • raw: "Submit"
                      • data: "Submit"
                      }
                    ]
                  }
                }
              • Text {...}
                • type: "Text"
                • start: 771
                • end: 772
                • raw: "\n"
                • data: "\n"
                }
              ]
            }
          }
        • Text {...}
          • type: "Text"
          • start: 779
          • end: 781
          • raw: " "
          • data: " "
          }
        • RegularElement {...}
          • type: "RegularElement"
          • start: 781
          • end: 847
          • name: "p"
          • attributes: []
          • fragment: Fragment {...}
            • type: "Fragment"
            • nodes: [...] (2)
              • Text {...}
                • type: "Text"
                • start: 784
                • end: 802
                • raw: "selected question "
                • data: "selected question "
                }
              • ExpressionTag {...}
                • type: "ExpressionTag"
                • start: 802
                • end: 843
                • expression: ConditionalExpression {...}
                  • type: "ConditionalExpression"
                  • start: 803
                  • end: 842
                  • loc: {...}
                    • start: {...}
                      • line: 34
                      • column: 22
                      }
                    • end: {...}
                      • line: 34
                      • column: 61
                      }
                    }
                  • test: Identifier {...}
                    • type: "Identifier"
                    • start: 803
                    • end: 811
                    • loc: {...}
                      • start: {...}
                        • line: 34
                        • column: 22
                        }
                      • end: {...}
                        • line: 34
                        • column: 30
                        }
                      }
                    • name: "selected"
                    }
                  • consequent: MemberExpression {...}
                    • type: "MemberExpression"
                    • start: 814
                    • end: 825
                    • loc: {...}
                      • start: {...}
                        • line: 34
                        • column: 33
                        }
                      • end: {...}
                        • line: 34
                        • column: 44
                        }
                      }
                    • object: Identifier {...}
                      • type: "Identifier"
                      • start: 814
                      • end: 822
                      • loc: {...}
                        • start: {...}
                          • line: 34
                          • column: 33
                          }
                        • end: {...}
                          • line: 34
                          • column: 41
                          }
                        }
                      • name: "selected"
                      }
                    • property: Identifier {...}
                      • type: "Identifier"
                      • start: 823
                      • end: 825
                      • loc: {...}
                        • start: {...}
                          • line: 34
                          • column: 42
                          }
                        • end: {...}
                          • line: 34
                          • column: 44
                          }
                        }
                      • name: "id"
                      }
                    • computed: false
                    • optional: false
                    }
                  • alternate: Literal {...}
                    • type: "Literal"
                    • start: 828
                    • end: 842
                    • loc: {...}
                      • start: {...}
                        • line: 34
                        • column: 47
                        }
                      • end: {...}
                        • line: 34
                        • column: 61
                        }
                      }
                    • value: "[waiting...]"
                    • raw: "'[waiting...]'"
                    }
                  }
                }
              ]
            }
          }
        • Text {...}
          • type: "Text"
          • start: 847
          • end: 849
          • raw: "\n\n"
          • data: "\n\n"
          }
        ]
      }
    • options: null
    • instance: Script {...}
      • type: "Script"
      • start: 0
      • end: 437
      • context: "default"
      • content: Program {...}
        • type: "Program"
        • start: 8
        • end: 428
        • loc: {...}
          • start: {...}
            • line: 1
            • column: 0
            }
          • end: {...}
            • line: 16
            • column: 0
            }
          }
        • body: [...] (4)
          • VariableDeclaration {...}
            • type: "VariableDeclaration"
            • start: 10
            • end: 230
            • loc: {...}
              • start: {...}
                • line: 2
                • column: 1
                }
              • end: {...}
                • line: 6
                • column: 3
                }
              }
            • declarations: [...] (1)
              • VariableDeclarator {...}
                • type: "VariableDeclarator"
                • start: 14
                • end: 229
                • loc: {...}
                  • start: {...}
                    • line: 2
                    • column: 5
                    }
                  • end: {...}
                    • line: 6
                    • column: 2
                    }
                  }
                • id: Identifier {...}
                  • type: "Identifier"
                  • start: 14
                  • end: 23
                  • loc: {...}
                    • start: {...}
                      • line: 2
                      • column: 5
                      }
                    • end: {...}
                      • line: 2
                      • column: 14
                      }
                    }
                  • name: "questions"
                  }
                • init: ArrayExpression {...}
                  • type: "ArrayExpression"
                  • start: 26
                  • end: 229
                  • loc: {...}
                    • start: {...}
                      • line: 2
                      • column: 17
                      }
                    • end: {...}
                      • line: 6
                      • column: 2
                      }
                    }
                  • elements: [...] (3)
                    • ObjectExpression {...}
                      • type: "ObjectExpression"
                      • start: 30
                      • end: 76
                      • loc: {...}
                        • start: {...}
                          • line: 3
                          • column: 2
                          }
                        • end: {...}
                          • line: 3
                          • column: 48
                          }
                        }
                      • properties: [...] (2)
                        • Property {...}
                          • type: "Property"
                          • start: 32
                          • end: 37
                          • loc: {...}
                            • start: {...}
                              • line: 3
                              • column: 4
                              }
                            • end: {...}
                              • line: 3
                              • column: 9
                              }
                            }
                          • method: false
                          • shorthand: false
                          • computed: false
                          • key: Identifier {...}
                            • type: "Identifier"
                            • start: 32
                            • end: 34
                            • loc: {...}
                              • start: {...}
                                • line: 3
                                • column: 4
                                }
                              • end: {...}
                                • line: 3
                                • column: 6
                                }
                              }
                            • name: "id"
                            }
                          • value: Literal {...}
                            • type: "Literal"
                            • start: 36
                            • end: 37
                            • loc: {...}
                              • start: {...}
                                • line: 3
                                • column: 8
                                }
                              • end: {...}
                                • line: 3
                                • column: 9
                                }
                              }
                            • value: 1
                            • raw: "1"
                            }
                          • kind: "init"
                          }
                        • Property {...}
                          • type: "Property"
                          • start: 39
                          • end: 74
                          • loc: {...}
                            • start: {...}
                              • line: 3
                              • column: 11
                              }
                            • end: {...}
                              • line: 3
                              • column: 46
                              }
                            }
                          • method: false
                          • shorthand: false
                          • computed: false
                          • key: Identifier {...}
                            • type: "Identifier"
                            • start: 39
                            • end: 43
                            • loc: {...}
                              • start: {...}
                                • line: 3
                                • column: 11
                                }
                              • end: {...}
                                • line: 3
                                • column: 15
                                }
                              }
                            • name: "text"
                            }
                          • value: TemplateLiteral {...}
                            • type: "TemplateLiteral"
                            • start: 45
                            • end: 74
                            • loc: {...}
                              • start: {...}
                                • line: 3
                                • column: 17
                                }
                              • end: {...}
                                • line: 3
                                • column: 46
                                }
                              }
                            • expressions: []
                            • quasis: [...] (1)
                              • TemplateElement {...}
                                • type: "TemplateElement"
                                • start: 46
                                • end: 73
                                • loc: {...}
                                  • start: {...}
                                    • line: 3
                                    • column: 18
                                    }
                                  • end: {...}
                                    • line: 3
                                    • column: 45
                                    }
                                  }
                                • value: {...}
                                  • raw: "Where did you go to school?"
                                  • cooked: "Where did you go to school?"
                                  }
                                • tail: true
                                }
                              ]
                            }
                          • kind: "init"
                          }
                        ]
                      }
                    • ObjectExpression {...}
                      • type: "ObjectExpression"
                      • start: 80
                      • end: 126
                      • loc: {...}
                        • start: {...}
                          • line: 4
                          • column: 2
                          }
                        • end: {...}
                          • line: 4
                          • column: 48
                          }
                        }
                      • properties: [...] (2)
                        • Property {...}
                          • type: "Property"
                          • start: 82
                          • end: 87
                          • loc: {...}
                            • start: {...}
                              • line: 4
                              • column: 4
                              }
                            • end: {...}
                              • line: 4
                              • column: 9
                              }
                            }
                          • method: false
                          • shorthand: false
                          • computed: false
                          • key: Identifier {...}
                            • type: "Identifier"
                            • start: 82
                            • end: 84
                            • loc: {...}
                              • start: {...}
                                • line: 4
                                • column: 4
                                }
                              • end: {...}
                                • line: 4
                                • column: 6
                                }
                              }
                            • name: "id"
                            }
                          • value: Literal {...}
                            • type: "Literal"
                            • start: 86
                            • end: 87
                            • loc: {...}
                              • start: {...}
                                • line: 4
                                • column: 8
                                }
                              • end: {...}
                                • line: 4
                                • column: 9
                                }
                              }
                            • value: 2
                            • raw: "2"
                            }
                          • kind: "init"
                          }
                        • Property {...}
                          • type: "Property"
                          • start: 89
                          • end: 124
                          • loc: {...}
                            • start: {...}
                              • line: 4
                              • column: 11
                              }
                            • end: {...}
                              • line: 4
                              • column: 46
                              }
                            }
                          • method: false
                          • shorthand: false
                          • computed: false
                          • key: Identifier {...}
                            • type: "Identifier"
                            • start: 89
                            • end: 93
                            • loc: {...}
                              • start: {...}
                                • line: 4
                                • column: 11
                                }
                              • end: {...}
                                • line: 4
                                • column: 15
                                }
                              }
                            • name: "text"
                            }
                          • value: TemplateLiteral {...}
                            • type: "TemplateLiteral"
                            • start: 95
                            • end: 124
                            • loc: {...}
                              • start: {...}
                                • line: 4
                                • column: 17
                                }
                              • end: {...}
                                • line: 4
                                • column: 46
                                }
                              }
                            • expressions: []
                            • quasis: [...] (1)
                              • TemplateElement {...}
                                • type: "TemplateElement"
                                • start: 96
                                • end: 123
                                • loc: {...}
                                  • start: {...}
                                    • line: 4
                                    • column: 18
                                    }
                                  • end: {...}
                                    • line: 4
                                    • column: 45
                                    }
                                  }
                                • value: {...}
                                  • raw: "What is your mother's name?"
                                  • cooked: "What is your mother's name?"
                                  }
                                • tail: true
                                }
                              ]
                            }
                          • kind: "init"
                          }
                        ]
                      }
                    • ObjectExpression {...}
                      • type: "ObjectExpression"
                      • start: 130
                      • end: 226
                      • loc: {...}
                        • start: {...}
                          • line: 5
                          • column: 2
                          }
                        • end: {...}
                          • line: 5
                          • column: 98
                          }
                        }
                      • properties: [...] (2)
                        • Property {...}
                          • type: "Property"
                          • start: 132
                          • end: 137
                          • loc: {...}
                            • start: {...}
                              • line: 5
                              • column: 4
                              }
                            • end: {...}
                              • line: 5
                              • column: 9
                              }
                            }
                          • method: false
                          • shorthand: false
                          • computed: false
                          • key: Identifier {...}
                            • type: "Identifier"
                            • start: 132
                            • end: 134
                            • loc: {...}
                              • start: {...}
                                • line: 5
                                • column: 4
                                }
                              • end: {...}
                                • line: 5
                                • column: 6
                                }
                              }
                            • name: "id"
                            }
                          • value: Literal {...}
                            • type: "Literal"
                            • start: 136
                            • end: 137
                            • loc: {...}
                              • start: {...}
                                • line: 5
                                • column: 8
                                }
                              • end: {...}
                                • line: 5
                                • column: 9
                                }
                              }
                            • value: 3
                            • raw: "3"
                            }
                          • kind: "init"
                          }
                        • Property {...}
                          • type: "Property"
                          • start: 139
                          • end: 224
                          • loc: {...}
                            • start: {...}
                              • line: 5
                              • column: 11
                              }
                            • end: {...}
                              • line: 5
                              • column: 96
                              }
                            }
                          • method: false
                          • shorthand: false
                          • computed: false
                          • key: Identifier {...}
                            • type: "Identifier"
                            • start: 139
                            • end: 143
                            • loc: {...}
                              • start: {...}
                                • line: 5
                                • column: 11
                                }
                              • end: {...}
                                • line: 5
                                • column: 15
                                }
                              }
                            • name: "text"
                            }
                          • value: TemplateLiteral {...}
                            • type: "TemplateLiteral"
                            • start: 145
                            • end: 224
                            • loc: {...}
                              • start: {...}
                                • line: 5
                                • column: 17
                                }
                              • end: {...}
                                • line: 5
                                • column: 96
                                }
                              }
                            • expressions: []
                            • quasis: [...] (1)
                              • TemplateElement {...}
                                • type: "TemplateElement"
                                • start: 146
                                • end: 223
                                • loc: {...}
                                  • start: {...}
                                    • line: 5
                                    • column: 18
                                    }
                                  • end: {...}
                                    • line: 5
                                    • column: 95
                                    }
                                  }
                                • value: {...}
                                  • raw: "What is another personal fact that an attacker could easily find with Google?"
                                  • cooked: "What is another personal fact that an attacker could easily find with Google?"
                                  }
                                • tail: true
                                }
                              ]
                            }
                          • kind: "init"
                          }
                        ]
                      }
                    ]
                  }
                }
              ]
            • kind: "let"
            }
          • VariableDeclaration {...}
            • type: "VariableDeclaration"
            • start: 233
            • end: 257
            • loc: {...}
              • start: {...}
                • line: 8
                • column: 1
                }
              • end: {...}
                • line: 8
                • column: 25
                }
              }
            • declarations: [...] (1)
              • VariableDeclarator {...}
                • type: "VariableDeclarator"
                • start: 237
                • end: 256
                • loc: {...}
                  • start: {...}
                    • line: 8
                    • column: 5
                    }
                  • end: {...}
                    • line: 8
                    • column: 24
                    }
                  }
                • id: Identifier {...}
                  • type: "Identifier"
                  • start: 237
                  • end: 245
                  • loc: {...}
                    • start: {...}
                      • line: 8
                      • column: 5
                      }
                    • end: {...}
                      • line: 8
                      • column: 13
                      }
                    }
                  • name: "selected"
                  }
                • init: CallExpression {...}
                  • type: "CallExpression"
                  • start: 248
                  • end: 256
                  • loc: {...}
                    • start: {...}
                      • line: 8
                      • column: 16
                      }
                    • end: {...}
                      • line: 8
                      • column: 24
                      }
                    }
                  • callee: Identifier {...}
                    • type: "Identifier"
                    • start: 248
                    • end: 254
                    • loc: {...}
                      • start: {...}
                        • line: 8
                        • column: 16
                        }
                      • end: {...}
                        • line: 8
                        • column: 22
                        }
                      }
                    • name: "$state"
                    }
                  • arguments: []
                  • optional: false
                  }
                }
              ]
            • kind: "let"
            }
          • VariableDeclaration {...}
            • type: "VariableDeclaration"
            • start: 260
            • end: 284
            • loc: {...}
              • start: {...}
                • line: 10
                • column: 1
                }
              • end: {...}
                • line: 10
                • column: 25
                }
              }
            • declarations: [...] (1)
              • VariableDeclarator {...}
                • type: "VariableDeclarator"
                • start: 264
                • end: 283
                • loc: {...}
                  • start: {...}
                    • line: 10
                    • column: 5
                    }
                  • end: {...}
                    • line: 10
                    • column: 24
                    }
                  }
                • id: Identifier {...}
                  • type: "Identifier"
                  • start: 264
                  • end: 270
                  • loc: {...}
                    • start: {...}
                      • line: 10
                      • column: 5
                      }
                    • end: {...}
                      • line: 10
                      • column: 11
                      }
                    }
                  • name: "answer"
                  }
                • init: CallExpression {...}
                  • type: "CallExpression"
                  • start: 273
                  • end: 283
                  • loc: {...}
                    • start: {...}
                      • line: 10
                      • column: 14
                      }
                    • end: {...}
                      • line: 10
                      • column: 24
                      }
                    }
                  • callee: Identifier {...}
                    • type: "Identifier"
                    • start: 273
                    • end: 279
                    • loc: {...}
                      • start: {...}
                        • line: 10
                        • column: 14
                        }
                      • end: {...}
                        • line: 10
                        • column: 20
                        }
                      }
                    • name: "$state"
                    }
                  • arguments: [...] (1)
                    • Literal {...}
                      • type: "Literal"
                      • start: 280
                      • end: 282
                      • loc: {...}
                        • start: {...}
                          • line: 10
                          • column: 21
                          }
                        • end: {...}
                          • line: 10
                          • column: 23
                          }
                        }
                      • value: ""
                      • raw: "''"
                      }
                    ]
                  • optional: false
                  }
                }
              ]
            • kind: "let"
            }
          • FunctionDeclaration {...}
            • type: "FunctionDeclaration"
            • start: 287
            • end: 427
            • loc: {...}
              • start: {...}
                • line: 12
                • column: 1
                }
              • end: {...}
                • line: 15
                • column: 2
                }
              }
            • id: Identifier {...}
              • type: "Identifier"
              • start: 296
              • end: 308
              • loc: {...}
                • start: {...}
                  • line: 12
                  • column: 10
                  }
                • end: {...}
                  • line: 12
                  • column: 22
                  }
                }
              • name: "handleSubmit"
              }
            • expression: false
            • generator: false
            • async: false
            • params: [...] (1)
              • Identifier {...}
                • type: "Identifier"
                • start: 309
                • end: 314
                • loc: {...}
                  • start: {...}
                    • line: 12
                    • column: 23
                    }
                  • end: {...}
                    • line: 12
                    • column: 28
                    }
                  }
                • name: "event"
                }
              ]
            • body: BlockStatement {...}
              • type: "BlockStatement"
              • start: 316
              • end: 427
              • loc: {...}
                • start: {...}
                  • line: 12
                  • column: 30
                  }
                • end: {...}
                  • line: 15
                  • column: 2
                  }
                }
              • body: [...] (2)
                • ExpressionStatement {...}
                  • type: "ExpressionStatement"
                  • start: 320
                  • end: 343
                  • loc: {...}
                    • start: {...}
                      • line: 13
                      • column: 2
                      }
                    • end: {...}
                      • line: 13
                      • column: 25
                      }
                    }
                  • expression: CallExpression {...}
                    • type: "CallExpression"
                    • start: 320
                    • end: 342
                    • loc: {...}
                      • start: {...}
                        • line: 13
                        • column: 2
                        }
                      • end: {...}
                        • line: 13
                        • column: 24
                        }
                      }
                    • callee: MemberExpression {...}
                      • type: "MemberExpression"
                      • start: 320
                      • end: 340
                      • loc: {...}
                        • start: {...}
                          • line: 13
                          • column: 2
                          }
                        • end: {...}
                          • line: 13
                          • column: 22
                          }
                        }
                      • object: Identifier {...}
                        • type: "Identifier"
                        • start: 320
                        • end: 325
                        • loc: {...}
                          • start: {...}
                            • line: 13
                            • column: 2
                            }
                          • end: {...}
                            • line: 13
                            • column: 7
                            }
                          }
                        • name: "event"
                        }
                      • property: Identifier {...}
                        • type: "Identifier"
                        • start: 326
                        • end: 340
                        • loc: {...}
                          • start: {...}
                            • line: 13
                            • column: 8
                            }
                          • end: {...}
                            • line: 13
                            • column: 22
                            }
                          }
                        • name: "preventDefault"
                        }
                      • computed: false
                      • optional: false
                      }
                    • arguments: []
                    • optional: false
                    }
                  }
                • ExpressionStatement {...}
                  • type: "ExpressionStatement"
                  • start: 346
                  • end: 424
                  • loc: {...}
                    • start: {...}
                      • line: 14
                      • column: 2
                      }
                    • end: {...}
                      • line: 14
                      • column: 80
                      }
                    }
                  • expression: CallExpression {...}
                    • type: "CallExpression"
                    • start: 346
                    • end: 423
                    • loc: {...}
                      • start: {...}
                        • line: 14
                        • column: 2
                        }
                      • end: {...}
                        • line: 14
                        • column: 79
                        }
                      }
                    • callee: Identifier {...}
                      • type: "Identifier"
                      • start: 346
                      • end: 351
                      • loc: {...}
                        • start: {...}
                          • line: 14
                          • column: 2
                          }
                        • end: {...}
                          • line: 14
                          • column: 7
                          }
                        }
                      • name: "alert"
                      }
                    • arguments: [...] (1)
                      • TemplateLiteral {...}
                        • type: "TemplateLiteral"
                        • start: 352
                        • end: 422
                        • loc: {...}
                          • start: {...}
                            • line: 14
                            • column: 8
                            }
                          • end: {...}
                            • line: 14
                            • column: 78
                            }
                          }
                        • expressions: [...] (3)
                          • MemberExpression {...}
                            • type: "MemberExpression"
                            • start: 373
                            • end: 384
                            • loc: {...}
                              • start: {...}
                                • line: 14
                                • column: 29
                                }
                              • end: {...}
                                • line: 14
                                • column: 40
                                }
                              }
                            • object: Identifier {...}
                              • type: "Identifier"
                              • start: 373
                              • end: 381
                              • loc: {...}
                                • start: {...}
                                  • line: 14
                                  • column: 29
                                  }
                                • end: {...}
                                  • line: 14
                                  • column: 37
                                  }
                                }
                              • name: "selected"
                              }
                            • property: Identifier {...}
                              • type: "Identifier"
                              • start: 382
                              • end: 384
                              • loc: {...}
                                • start: {...}
                                  • line: 14
                                  • column: 38
                                  }
                                • end: {...}
                                  • line: 14
                                  • column: 40
                                  }
                                }
                              • name: "id"
                              }
                            • computed: false
                            • optional: false
                            }
                          • MemberExpression {...}
                            • type: "MemberExpression"
                            • start: 389
                            • end: 402
                            • loc: {...}
                              • start: {...}
                                • line: 14
                                • column: 45
                                }
                              • end: {...}
                                • line: 14
                                • column: 58
                                }
                              }
                            • object: Identifier {...}
                              • type: "Identifier"
                              • start: 389
                              • end: 397
                              • loc: {...}
                                • start: {...}
                                  • line: 14
                                  • column: 45
                                  }
                                • end: {...}
                                  • line: 14
                                  • column: 53
                                  }
                                }
                              • name: "selected"
                              }
                            • property: Identifier {...}
                              • type: "Identifier"
                              • start: 398
                              • end: 402
                              • loc: {...}
                                • start: {...}
                                  • line: 14
                                  • column: 54
                                  }
                                • end: {...}
                                  • line: 14
                                  • column: 58
                                  }
                                }
                              • name: "text"
                              }
                            • computed: false
                            • optional: false
                            }
                          • Identifier {...}
                            • type: "Identifier"
                            • start: 413
                            • end: 419
                            • loc: {...}
                              • start: {...}
                                • line: 14
                                • column: 69
                                }
                              • end: {...}
                                • line: 14
                                • column: 75
                                }
                              }
                            • name: "answer"
                            }
                          ]
                        • quasis: [...] (4)
                          • TemplateElement {...}
                            • type: "TemplateElement"
                            • start: 353
                            • end: 371
                            • loc: {...}
                              • start: {...}
                                • line: 14
                                • column: 9
                                }
                              • end: {...}
                                • line: 14
                                • column: 27
                                }
                              }
                            • value: {...}
                              • raw: "answered question "
                              • cooked: "answered question "
                              }
                            • tail: false
                            }
                          • TemplateElement {...}
                            • type: "TemplateElement"
                            • start: 385
                            • end: 387
                            • loc: {...}
                              • start: {...}
                                • line: 14
                                • column: 41
                                }
                              • end: {...}
                                • line: 14
                                • column: 43
                                }
                              }
                            • value: {...}
                              • raw: " ("
                              • cooked: " ("
                              }
                            • tail: false
                            }
                          • TemplateElement {...}
                            • type: "TemplateElement"
                            • start: 403
                            • end: 411
                            • loc: {...}
                              • start: {...}
                                • line: 14
                                • column: 59
                                }
                              • end: {...}
                                • line: 14
                                • column: 67
                                }
                              }
                            • value: {...}
                              • raw: ") with \""
                              • cooked: ") with \""
                              }
                            • tail: false
                            }
                          • TemplateElement {...}
                            • type: "TemplateElement"
                            • start: 420
                            • end: 421
                            • loc: {...}
                              • start: {...}
                                • line: 14
                                • column: 76
                                }
                              • end: {...}
                                • line: 14
                                • column: 77
                                }
                              }
                            • value: {...}
                              • raw: "\""
                              • cooked: "\""
                              }
                            • tail: true
                            }
                          ]
                        }
                      ]
                    • optional: false
                    }
                  }
                ]
              }
            }
          ]
        • sourceType: "module"
        }
      • attributes: []
      }
    }
The AST is not public API and may change at any point in time
Select bindings • Playground • Svelte