Hacktoberfest 2026: những issue maintainer đã đánh dấu cho tháng Mười, đang mở và phù hợp người mới. Xem issue Hacktoberfest

Document the pre-chat form

Đang mở Phù hợp với người mới
#70 5 bình luận 0 reaction 0 người được giao Xem trên GitHub

Maintainer thường phản hồi trong vòng 1 ngày

@masyarakatai đang làm issue này rồi.

Từ ngày 16/10/2026.

Đánh giá

Độ khó
2/5
Thời gian dự kiến
1-3 giờ
Mức phù hợp với người mới
88/100
Loại issue
Tài liệu
Độ rõ ràng
Đặc tả rõ ràng
Mức độ hoạt động
Sôi nổi
Công nghệ
typescript
Lĩnh vực
documentation

Hướng nghiên cứu

Đọc packages/widget/src/widget.ts và packages/widget/src/dom/prechat-form.ts để tìm hiểu cấu hình và hành vi, sau đó xem packages/widget/dev.html làm ví dụ. Thêm website/src/content/docs/widget/pre-chat-form.mdx, cập nhật website/src/content/docs/widget/configuration.mdx và thanh bên trong website/astro.config.mjs; hoàn tất khi các tùy chọn được liệt kê, hành vi, sự kiện và callback đã được ghi tài liệu, đồng thời pnpm --filter @chatcops/website build chạy thành công.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Mô tả

documentation good first issue hacktoberfest widget

The widget now has a configurable pre-chat form that collects details like name and email before the conversation starts. It shipped in @chatcops/widget 0.4.0, but the docs site only mentions it in the request schema on the Server Setup page. The WidgetConfig reference on the Configuration page also leaves out preChatForm, onLeadCaptured and onPreChatSubmit.

Where to look

  • packages/widget/src/widget.ts (PreChatField, PreChatFormConfig, WidgetConfig, handlePreChatSubmit, showChatView)
  • packages/widget/src/dom/prechat-form.ts (field types and validation)
  • packages/widget/dev.html (a working example config)
  • website/src/content/docs/widget/configuration.mdx
  • website/astro.config.mjs (sidebar)

Acceptance criteria

  • New page website/src/content/docs/widget/pre-chat-form.mdx, added to the Widget section of the sidebar
  • Documents enabled, title, subtitle, submitLabel, and each field option: name, type (text, email, select or textarea), label, placeholder, required, options
  • Explains how the form behaves:
    • it only shows when there is no saved conversation and it hasn't been submitted in this browser session
    • required fields and email format are validated
    • a field named name personalizes the welcome message
    • a field named message is sent as the first chat message
    • answers go to the server as userData (up to 50 fields, names up to 100 characters, each value up to 500 characters) with the next chat request, and are re-sent if that request fails
    • the server saves the answers with the conversation's first message and uses the saved ones from then on, so later requests can't change them. The server's preChatFields option (packages/server/src/config.ts:45) keeps only the listed fields. Link to it on the Server Setup page instead of documenting it again
  • Documents onPreChatSubmit and the preChatSubmit event
  • Notes that the form can only be configured from JavaScript (there are no data-* attributes for it)
  • WidgetConfig in configuration.mdx includes preChatForm, onLeadCaptured and onPreChatSubmit
  • pnpm --filter @chatcops/website build succeeds
  • Docs only, no changeset needed

Want to work on this? Comment below and I'll assign it to you. Please take one issue at a time, branch off dev, and open your PR against dev with Closes #<this issue number>. Setup notes (pnpm, build before test) are in CONTRIBUTING.md.

Ngôn ngữ chính
TypeScript
Star
13
Fork
7
Merge trung bình
3 giờ 41 phút
Pull request đã merge (30 ngày)
155

Chuẩn bị môi trường

Bắt đầu từ đâu

  1. Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
  2. Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
  3. Fork repository và làm thay đổi trên một nhánh.
  4. Mở pull request có tham chiếu số hiệu của issue.

Issue khác của codercops/chatcops

Tất cả issue của codercops/chatcops

Issue tương tự

Thêm issue về TypeScript

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.