Hi all,
I have a new Svelte-Kit app I am working on and hosting on Netlify:
https://arrow-kit.netlify.app/
…and I have a form set up on one of the pages that is literally copied and pasted from a Sapper(former Svelte-kit) app that works perfectly in Netlify.
The form in the Svelte-Kit app is not showing up in the Netlify Forms page in the dashboard, however, and I’m not sure what to do…I’m talking with the Svelte-Kit core team and community, but I thought I’d ask here as well to see if anybody has any insight.
Thank you
I have this issue as well. Upon inspecting the code of the rendered form in the browser, it seems that Netlify isn’t detecting the data-netlify=“true” attribute since that attribute is still there on the form.
Let me know if you’re able to resolve this.
Thanks
Seems there’s already an open issue for this:
opened 06:48AM - 10 Apr 21 UTC
closed 06:22AM - 20 May 21 UTC
pkg:adapter-netlify
**Describe the bug**
[Netlify Forms](https://www.netlify.com/products/forms/) d… on't work in a Svelte component if setup with [this approach](https://www.netlify.com/blog/2017/07/20/how-to-integrate-netlifys-form-handling-in-a-react-app/) and using the [Netlify adapter](https://github.com/sveltejs/kit/tree/master/packages/adapter-netlify).
_Edit: For a workaround/fix see the comment below https://github.com/sveltejs/kit/issues/942#issuecomment-828726791_
**To Reproduce**
1. Setup a Netlify Form as described [here](https://docs.netlify.com/forms/setup/) and more specifically [here](https://www.netlify.com/blog/2017/07/20/how-to-integrate-netlifys-form-handling-in-a-react-app/):
* Create a Netlify "form detection helper". Something like:
```html
<form name="test" netlify netlify-honeypot="bot-field" hidden>
<input type="text" name="name" />
<input type="email" name="email" />
<textarea name="message"></textarea>
</form>
```
* Create the Svelte form component:
```svelte
<form name="test" method="post" action="/success">
<input type="hidden" name="form-name" value="test" />
<input type="text" name="bot-field" />
<p>
<label>Your Name: <input type="text" name="name" /></label>
</p>
<p>
<label>Your Email: <input type="email" name="email" /></label>
</p>
<p>
<label>Message: <textarea name="message" /></label>
</p>
<p>
<button type="submit">Send</button>
</p>
</form>
```
* Ensure Netlify's form processing is enabled.
2. If everything is setup correctly, Netlify should tell you that it detected a form named "test" for your site.
3. Now navigate to your https://example.tld/test-form and send a submission.
4. Even when taking care of all troubleshooting tips from [here](https://docs.netlify.com/forms/troubleshooting-tips/) and [here](https://answers.netlify.com/t/support-guide-form-problems-form-debugging-404-when-submitting/92), neither verified nor spam submissions show up in Netlify's form overview.
**Expected behavior**
A form submission should be shown in Netlify's form overview if submitted via my SvelteKit webapp.
**Information about your SvelteKit Installation:**
* @sveltejs/kit: next => 1.0.0-next.64
* @sveltejs/adapter-netlify => 1.0.0-next.4
* svelte: ^3.29.0 => 3.36.0
* vite: ^2.1.0 => 2.1.4
**Severity**
Blocker, as Netlify's simple form handling is one of the key benefits I'm using it for. However, right now I cannot use Netlify Forms with SvelteKit.
**Additional context**
* I tested all combinations of with/without honeypot field and success message.
* There is no problem when using Netlify Forms in a regular HTML file, e.g. via [static adapter](https://github.com/sveltejs/kit/tree/master/packages/adapter-static).
* I suspect that it might have something to do with https://github.com/sveltejs/kit/issues/930 ?!
Same here. All of my forms properly contain data-netlify=“true” but are not being detected during the build/deploy process. It’s driving me mad.
perry
April 30, 2021, 9:36pm
5
hi there, sorry to hear this. Are any of the steps outlined in that issue working for you to resolve this?
Perry,
Thanks for reaching out— I realized a little after posting that the section I chimed in on was irrelevant to my situation, although our issues were the same. I solved my particular issue by simply adding —minify to my build command (still don’t really know why, honestly)
1 Like
Thank you for confirming, @RT_Hinkel ! I am glad you found a workaround here!
I have recently resolved this as well…although I dunno if it will stay working in the future…if it fails again i will return to this post…but thank you
1 Like
Thank you for letting us know, @rchrdnsh ! Please do come back if the issue crops up again. Additionally, please feel free to share your solution
