@sealcode/sealgen 0.11.8 → 0.12.2

package/lib/forms/form.test.js

@@ -1,275 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.form_factory = void 0;
-const router_1 = __importDefault(require("@koa/router"));
-const axios_1 = __importDefault(require("axios"));
-const koa_1 = __importDefault(require("koa"));
-const index_1 = require("../index");
-const mount_1 = require("../mount");
-const locator_is_visible_1 = require("../test_utils/locator_is_visible");
-const browser_creator_1 = require("../utils/browser-creator");
-const utils_1 = require("../utils/utils");
-const fields = {
-    text: new index_1.Fields.SimpleFormField(true),
-};
-function form_factory(canAccessFun) {
-    const result = new (class extends index_1.Form {
-        constructor() {
-            super(...arguments);
-            this.fields = fields;
-            this.submitButtonText = "Submit";
-            this.controls = [
-                new index_1.Controls.SimpleInput(fields.text, {
-                    label: "This is a test:",
-                    type: "password",
-                }),
-            ];
-        }
-        async onSubmit() {
-            return;
-        }
-    })();
-    if (canAccessFun)
-        result.canAccess = canAccessFun;
-    return result;
-}
-exports.form_factory = form_factory;
-describe("form test", () => {
-    let page;
-    before(async () => {
-        const browser = await (0, browser_creator_1.getBrowser)();
-        const context = await browser.newContext();
-        page = await context.newPage();
-    });
-    describe("basic tests", async () => {
-        let server;
-        before(async () => {
-            const app = new koa_1.default();
-            const router = new router_1.default();
-            (0, mount_1.mount)(router, "/", form_factory(), true);
-            app.use(router.routes()).use(router.allowedMethods());
-            server = app.listen(8080);
-            await page.goto("http://localhost:8080");
-        });
-        after(async () => {
-            server.close();
-        });
-        it("does not allow to submit an empty form when there's a required field", async () => {
-            await page.getByRole("button", { name: "Submit", exact: true }).click();
-            await (0, utils_1.assertThrowsAsync)(async () => {
-                return page.getByText("Done").click({ timeout: 500 });
-            });
-        });
-        it("allows to submit a form when all required fields have a value", async () => {
-            await page.getByPlaceholder("password").click();
-            await page.getByPlaceholder("password").fill("testpasswd");
-            await page.getByRole("button", { name: "Submit", exact: true }).click();
-            await page.getByText("Done").click();
-        });
-        it("does not allow submitting an empty form by circumventing HTML-based validation", async () => {
-            const res_axios = await axios_1.default.post("http://localhost:8080", {
-                text: "",
-            }, {
-                validateStatus: (status) => {
-                    if (status == 422)
-                        return true;
-                    return false;
-                },
-            });
-            if (!res_axios.data.includes("Some fields are invalid")) {
-                throw new Error("when sending a empty request with axios, the error didnt appear");
-            }
-        });
-    });
-    describe("canAccess tests", async () => {
-        let server;
-        afterEach(async () => {
-            server.close();
-        });
-        it("allows visit when configured when canAccess returns true", async () => {
-            const app = new koa_1.default();
-            const router = new router_1.default();
-            (0, mount_1.mount)(router, "/", form_factory(async (ctx) => {
-                return { canAccess: true, message: "" };
-            }), true);
-            app.use(router.routes()).use(router.allowedMethods());
-            server = app.listen(8080);
-            const response = await page.goto("http://localhost:8080");
-            if (response?.status() != 200) {
-                throw new Error(`Should return 200 status and it returns ${response?.status()}`);
-            }
-        });
-        describe("declines access when canAccess returns false", async () => {
-            const app = new koa_1.default();
-            const router = new router_1.default();
-            before(async () => {
-                (0, mount_1.mount)(router, "/", form_factory(async (ctx) => {
-                    return { canAccess: false, message: "" };
-                }), true);
-                app.use(router.routes()).use(router.allowedMethods());
-            });
-            beforeEach(async () => {
-                server = app.listen(8080);
-            });
-            it("prevents the form from rendering", async () => {
-                const response = await page.goto("http://localhost:8080");
-                if (response?.status() != 403) {
-                    throw new Error(`Should return 403 status and it returns ${response?.status()}`);
-                }
-            });
-            it("does not allow submitting of the form through axios", async () => {
-                await axios_1.default.post("http://localhost:8080", {
-                    text: "sample",
-                }, {
-                    validateStatus: (status) => {
-                        if (status == 403)
-                            return true;
-                        return false;
-                    },
-                });
-            });
-        });
-        it("passes the context to canAccess (false case)", async () => {
-            const app = new koa_1.default();
-            const router = new router_1.default();
-            (0, mount_1.mount)(router, "/", form_factory(async (ctx) => {
-                return ctx.$context && ctx.$context.user_id
-                    ? { canAccess: true, message: "" }
-                    : { canAccess: false, message: "" };
-            }), true);
-            app.use(router.routes()).use(router.allowedMethods());
-            server = app.listen(8080);
-            const response = await page.goto("http://localhost:8080");
-            if (response?.status() != 403) {
-                throw new Error(`Should return 403 status and it returns ${response?.status()}`);
-            }
-        });
-        it("passes the context to canAccess (true case)", async () => {
-            const app = new koa_1.default();
-            const router = new router_1.default();
-            router.use(async (ctx, next) => {
-                ctx.$context = {
-                    user_id: "miguel",
-                };
-                await next();
-            });
-            (0, mount_1.mount)(router, "/", form_factory(async (ctx) => {
-                return ctx.$context && ctx.$context.user_id
-                    ? { canAccess: true, message: "" }
-                    : { canAccess: false, message: "" };
-            }), true);
-            app.use(router.routes()).use(router.allowedMethods());
-            server = app.listen(8080);
-            const response = await page.goto("http://localhost:8080");
-            if (response?.status() != 200) {
-                throw new Error(`Should return 200 status and it returns ${response?.status()}`);
-            }
-        });
-    });
-    describe("validation e2e", async () => {
-        describe("validation message", async () => {
-            let server;
-            before(async () => {
-                const app = new koa_1.default();
-                const router = new router_1.default();
-                (0, mount_1.mount)(router, "/", new (class extends index_1.Form {
-                    constructor() {
-                        super(...arguments);
-                        this.fields = fields;
-                        this.submitButtonText = "Submit";
-                        this.controls = [
-                            new index_1.Controls.SimpleInput(fields.text, {
-                                label: "This is a test:",
-                                type: "password",
-                            }),
-                        ];
-                    }
-                    async onSubmit() {
-                        return;
-                    }
-                    async validateValues(ctx, data) {
-                        if (data.text === "incorrect")
-                            return {
-                                valid: false,
-                                error: "Incorrect input",
-                            };
-                        return { valid: true, error: "" };
-                    }
-                })(), true);
-                app.use(router.routes()).use(router.allowedMethods());
-                server = app.listen(8080);
-                await page.goto("http://localhost:8080");
-            });
-            after(async () => {
-                server.close();
-            });
-            it("shows up when incorrect input is given", async () => {
-                await page.getByPlaceholder("password").click();
-                await page.getByPlaceholder("password").fill("incorrect");
-                await page.getByRole("button", { name: "Submit" }).click();
-                if (!(await (0, locator_is_visible_1.locator_is_visible)(page.getByText("Incorrect input"))))
-                    throw new Error("validation message doens't show up when input is incorrect");
-            });
-            it("doesn't show when correct input is given", async () => {
-                await page.getByPlaceholder("password").click();
-                await page.getByPlaceholder("password").fill("correct");
-                await page.getByRole("button", { name: "Submit" }).click();
-                await (0, utils_1.assertThrowsAsync)(async () => {
-                    return page.getByText("Incorrect input").click({ timeout: 500 });
-                });
-            });
-        });
-        describe("field specific validation message", async () => {
-            let server;
-            before(async () => {
-                const app = new koa_1.default();
-                const router = new router_1.default();
-                const fields = {
-                    text: new index_1.Fields.EmailField(true),
-                };
-                (0, mount_1.mount)(router, "/", new (class extends index_1.Form {
-                    constructor() {
-                        super(...arguments);
-                        this.fields = fields;
-                        this.submitButtonText = "Submit";
-                        this.controls = [
-                            new index_1.Controls.SimpleInput(fields.text, {
-                                label: "This is a test:",
-                                type: "text",
-                            }),
-                        ];
-                    }
-                    async onSubmit() {
-                        return;
-                    }
-                })(), true);
-                app.use(router.routes()).use(router.allowedMethods());
-                server = app.listen(8080);
-                await page.goto("http://localhost:8080");
-            });
-            after(async () => {
-                server.close();
-            });
-            it("shows up when incorrect input is given", async () => {
-                await page.getByPlaceholder("text").click();
-                await page.getByPlaceholder("text").fill("notanemail");
-                await page.getByRole("button", { name: "Submit" }).click();
-                await page.getByText("Please enter a proper email address").click();
-            });
-            it("doesn't show up when correct input is given", async () => {
-                await page.getByPlaceholder("text").click();
-                await page.getByPlaceholder("text").fill("yes@an.email");
-                await page.getByRole("button", { name: "Submit" }).click();
-                (0, utils_1.assertThrowsAsync)(async () => {
-                    return page
-                        .getByText("Please enter a proper email address")
-                        .click({ timeout: 500 });
-                });
-            });
-        });
-    });
-});
-//# sourceMappingURL=form.test.js.map

package/lib/forms/multiform.js

@@ -1,178 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Multiform = void 0;
-const ts_predicates_1 = require("@sealcode/ts-predicates");
-const tempstream_1 = require("tempstream");
-const mountable_with_fields_1 = require("../page/mountable-with-fields");
-const sanitize_1 = require("../sanitize");
-const FIELD_PREFIX_SEPARATOR = "___";
-class Multiform extends mountable_with_fields_1.MountableWithFields {
-    constructor() {
-        super(...arguments);
-        this.controls = [];
-    }
-    init() {
-        super.init();
-        for (const [key, form] of Object.entries(this.forms)) {
-            if (key !== (0, sanitize_1.attribute)(key)) {
-                throw new Error(`Form name "${key}" is not url-safe. Try: "${(0, sanitize_1.attribute)(key)}"`);
-            }
-            form.makeOpenFormTag = () => `<div>`;
-            form.makeCloseFormTag = () => `</div>`;
-            form.field_names_prefix = key + FIELD_PREFIX_SEPARATOR;
-            form.form_id = this.name;
-            form.action = "./" + key;
-            form.init();
-            form.extractRawValues = async (context) => this.getSubformRawValues(context, key);
-            const submit_button_id = this.name + "_" + key + "_submit";
-            form.makeSubmitButton = () => /* HTML */ `<input
-				type="submit"
-				value="${form.submitButtonText}"
-				formaction="${form.action}"
-				id="${submit_button_id}"
-				${form.form_id ? `form="${form.form_id}"` : ""}
-			/> `;
-        }
-        for (const form of Object.values(this.forms)) {
-            for (const field of Object.values(form.fields)) {
-                if (field.name.includes(FIELD_PREFIX_SEPARATOR)) {
-                    throw new Error(`A field name within multiform cannot contain '${FIELD_PREFIX_SEPARATOR}'`);
-                }
-            }
-        }
-    }
-    async extractRawValues(ctx) {
-        return ctx.$body || {};
-    }
-    async canAccess() {
-        return {
-            canAccess: true,
-            message: "this view includes multiple forms and each of them have their unique access rules",
-        };
-    }
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    getSubformsToRender(ctx) {
-        const requested_frame = ctx.headers["turbo-frame"];
-        if (!(0, ts_predicates_1.is)(requested_frame, ts_predicates_1.predicates.or(ts_predicates_1.predicates.undefined, ts_predicates_1.predicates.string))) {
-            throw new Error("Wrong turbo-frame header value type");
-        }
-        const forms_to_render = requested_frame && this.forms[requested_frame]
-            ? [[requested_frame, this.forms[requested_frame]]]
-            : Object.entries(this.forms);
-        return forms_to_render;
-    }
-    async renderSubform(ctx, sub_form_name, show_field_errors) {
-        const form = this.forms[sub_form_name];
-        const result = await form.canAccess(ctx);
-        if (!result.canAccess) {
-            return result.message;
-        }
-        return form.render(ctx, {
-            raw_values: await this.getSubformRawValues(ctx, sub_form_name),
-            messages: [],
-        }, show_field_errors);
-    }
-    async getSubformRawValues(ctx, sub_form_name) {
-        const result = Object.fromEntries(Object.entries(await this.extractRawValues(ctx))
-            .filter(([key]) => key.startsWith(sub_form_name + FIELD_PREFIX_SEPARATOR))
-            .map(([key, value]) => [
-            key.slice((sub_form_name + FIELD_PREFIX_SEPARATOR).length),
-            value,
-        ]));
-        return result;
-    }
-    async render(ctx, messages, prerenderedForms = {}, show_field_errors) {
-        return (0, tempstream_1.tempstream /* HTML */) `${this.renderMessages(ctx, {
-            raw_values: {},
-            messages,
-        })}
-			<div class="forms">
-				<form
-					id="${this.name}"
-					novalidate
-					${
-        /* novalidate is here because all the subforms are actually one form and errors in one will prevent submitting all of the forms */ ""}
-					method="POST"
-				></form>
-				${this.getSubformsToRender(ctx).map(([form_name]) => {
-            const frame_form_id = this.name + "_" + form_name + "_frame_form";
-            return (0, tempstream_1.tempstream /* HTML */) `<turbo-frame
-						id="${form_name}"
-						contains-subform
-						subform-id="${frame_form_id}"
-					>
-						${prerenderedForms[form_name] ||
-                this.renderSubform(ctx, form_name, show_field_errors)}
-						<form id="${frame_form_id}" method="POST"></form>
-					</turbo-frame>`;
-        })}
-			</div>
-			${this.makeBottomScript()}`;
-    }
-    makeBottomScript() {
-        // this script assigns each field to its corresponding form, instead of
-        // the html-only version where all fields are attached to one meta-form
-        return /* HTML */ ` <script>
-			(function () {
-				if (!window.subform_handlers) {
-					window.subform_handlers = {};
-				}
-				if (window.subform_handlers["${this.name}"]) {
-					return;
-				}
-				const handler = () => {
-					document
-						.querySelectorAll("turbo-frame[contains-subform]")
-						.forEach((frame) => {
-							frame_form_id = frame.getAttribute("subform-id");
-							frame.querySelectorAll("input").forEach((input) => {
-								input.setAttribute("form", frame_form_id);
-							});
-						});
-				};
-				window.subform_handlers["${this.name}"] = handler;
-				document.documentElement.addEventListener(
-					"turbo:load",
-					handler
-				);
-				document.documentElement.addEventListener(
-					"turbo:frame-render",
-					handler
-				);
-			})();
-		</script>`;
-    }
-    mount(router, path) {
-        router.get(path, async (ctx) => {
-            ctx.type = "html";
-            ctx.body = await this.render(ctx, [], {}, false);
-        });
-        for (const [key, form] of Object.entries(this.forms)) {
-            router.post(path + (path.endsWith("/") ? "" : "/") + key, async (ctx) => {
-                const result = await form.canAccess(ctx);
-                if (!result.canAccess) {
-                    ctx.body = this.renderError(ctx, {
-                        type: "access",
-                        message: result.message,
-                    });
-                    ctx.status = 403;
-                    return;
-                }
-                const reaction = await form.handlePost(ctx);
-                if (reaction.action == "stay") {
-                    ctx.status = 422;
-                    const form_content = reaction.content;
-                    ctx.body = this.render(ctx, [], {
-                        [key]: form_content,
-                    }, true);
-                }
-                else if (reaction.action == "redirect") {
-                    ctx.status = 303;
-                    ctx.redirect(reaction.url);
-                }
-            });
-        }
-    }
-}
-exports.Multiform = Multiform;
-//# sourceMappingURL=multiform.js.map