zikani03 / ika Goto Github PK

The site up at labs.zikani.me/ika is okay but it's just a demo. Would be good to have a better documentation site with more information about the library, it's motivations, examples and some few notes about the faker library integration.

Sounds cool.

When ika component is loaded as a popup, i.e. user did not specify an #ika-apa element, we should make it draggable so that it can be moved across the screen to a convenient position for the user since right now it just pops up at the bottom right corner.

I as a Developer want to be able to use ika for multiple forms, but having to create a window.ikaFakerOptions for every separate page is going to get annoying. It would be nice to be able to define the configuration for ika in one place and have it loaded on multiple pages.

I am thinking something like

        window.ikaForms = {
            "*": {
                "firstName": "faker.name.firstName",
                "lastName": "faker.name.lastName",
                "dateOfBirth": function(el) {
                    return faker.date.birthdate().toISOString().substring(0, 10)
                }
            },
            "form[name=specificForm]": {
                "firstName": "faker.name.firstName",
                "lastName": "faker.name.firstName",
                "dateOfBirth": function(el) {
                    return "1901-01-01"
                }
            }
        }

Ika should default to using the "name" attribute of a form input if the data-ika attributes have not been set.

Add TypeScript compiler and type definitions

Would be interesting to use the faker.js library to generate random input for tagged fields.

When ika comes across a <select> input it should randomize the selection of an option for the field when using the faker mode, when using the tag mode it should select the <option> that matches the value of the tag, similar to how checkboxes and radios are handled.

Add SCSS for making writing the CSS styles more convenient

Currently, users of the library have to add an element "ika-apa" to indicate where they want the input to appear. We should consider adding some kind of autoload which could perhaps load the input as a widget in bottom right corner - similar to how chat bubbles appear. This could enable us to use ika even on a page that a developer has not explicitly added through bookmark or extension in the browser.

So to have this working we have to have

• Autoload functionality that doesn't require an ika-apa element on the page
• Field name mapping to be auto-detected based on input name
• The input must appear in bottom right corner as a bubble

Add a component that can be used in Vue projects. There is an experimental branch here

Does not handle inputs that contain colons properly, like URLs.

Basically, ika should be able to generate random inputs and place them on input fields to help developers test validation and sanitization of their inputs.

Have got a couple of suggestions that this would good as a browser extension