Support async arrow function for inline event handlers

[lgirma]

It would be nice to have async inline event handlers without writing the full function in the <script> tag like:

<button on:click={async () => {await services.saveData()}}>
    Save
</button>

Currently, the compiler raises the following compile error

ReferenceError: async is not defined.

REPL Demo
MDN Reference

[Conduitry]

The compiler does not appear to be throwing an error, but the generated code is invalid, and the event handler is not labeled as async. This is a bug, but can be worked around for now by defining the click handler in the <script> block.

[Conduitry]

diff --git a/src/compiler/compile/nodes/shared/Expression.ts b/src/compiler/compile/nodes/shared/Expression.ts
index 3702800c..938cd843 100644
--- a/src/compiler/compile/nodes/shared/Expression.ts
+++ b/src/compiler/compile/nodes/shared/Expression.ts
@@ -363,7 +363,7 @@ export default class Expression {
 					}
 
 					const fn = deindent`
-						function ${name}(${args.join(', ')}) ${body}
+						${node.async && 'async '}function${node.generator && '*'} ${name}(${args.join(', ')}) ${body}
 					`;
 
 					if (dependencies.size === 0 && contextual_dependencies.size === 0) {

When created fully or partially hoisted function declarations, this makes sure their async-ness and generator-ness are specified correctly. I don't think there's anything else we need to do for this.

[Conduitry]

This is fixed in 3.6.11 - https://svelte.dev/repl/6715cdf1e8324c10bc5d4c6e9489bcbf?version=3.6.11