@mapedy/basic-form-protection

1.0.2 • Public • Published

🛡️ Basic Form Protection (Vanilla JS, No Accessibility)

A minimalistic and dependency-free script that adds anti-spam, anti-bot, and anti-abuse protection to forms — designed especially for static websites, WordPress (Elementor, Contact Form 7), and custom HTML.

⚠️ Warning: This script disables certain accessibility features like autocomplete, contextmenu, and text selection. Use it only on forms where bot protection is more important than accessibility.


✨ Features

  • 🔒 Disables autocomplete to prevent auto-filled bots.
  • 🚫 Blocks pasted links and typed URLs in input/textarea fields.
  • 🧼 Cleans possible injections like <script>, onerror, and javascript:.
  • 🖱️ Disables right-click, text selection, drag-and-drop on fields and images.
  • ⏱️ Rejects form submissions made in <3 seconds (likely automated).
  • 🧠 Prevents common DevTools hotkeys like F12, Ctrl+U, Ctrl+Shift+I.
  • 📊 Sends events to Google Analytics (gtag) and Facebook Pixel (fbq) if detected spammy behavior.
  • ✅ Works with .wpcf7-form, .elementor-form, and all <form> elements by default.

📦 Installation

npm install @mapedy/basic-form-protection

Then include it on your site (ESM or bundler-compatible only):

import "@mapedy/basic-form-protection";

Or via jsDelivr CDN:

<script src="https://cdn.jsdelivr.net/npm/@mapedy/basic-form-protection/form-guardian.min.js"></script>

🧪 Behavior Overview

Once included, this script automatically scans forms on the page and applies:

  • autocomplete="off" after render delay.
  • Blocking paste and input if links or suspicious code is detected.
  • Disabling suspicious key combos.
  • Blocking dragstart, context menu, and text selection.
  • Measures time between form render and submit:
    • If < 3s, cancels submission and fires tracking events (if available).

📊 Analytics Events

If your site has Google Tag (gtag) or Facebook Pixel (fbq) initialized, the script will automatically emit events on suspicious actions:

gtag("event", "SuspectedSpambot", {
  event_category: "Form Protection",
  event_label: "TooFastSubmission",
});
fbq("trackCustom", "SuspectedSpambot", {
  reason: "TooFastSubmission",
});

🌐 Compatible With

  • WordPress + Elementor forms
  • Contact Form 7
  • Custom HTML forms
  • Static websites
  • Jamstack / Headless forms

💬 Use Case

This script is ideal when:

  • You're tired of bots filling out your lead/contact forms.
  • You need lightweight protection without heavy CAPTCHA or external APIs.
  • You offer alternative communication options for people with disabilities, and ensuring form accessibility isn’t a priority.

🧩 Keywords

  • Form Security
  • Anti-Bot
  • Anti-Spam
  • Data Protection
  • Web Development
  • Input Sanitization
  • JavaScript
  • VanillaJS
  • Lightweight
  • Form Protection
  • Elementor
  • Wordpress
  • Lead Protection
  • Frontend Security
  • Web Performance

📁 License

This project is licensed under the MIT License - see the LICENSE file for details.


Author

Alexey Kovalevsky

Package Sidebar

Install

npm i @mapedy/basic-form-protection

Weekly Downloads

7

Version

1.0.2

License

MIT

Unpacked Size

7.48 kB

Total Files

3

Last publish

Collaborators

  • mapedy