2 |
Delete this tab?
3 |
4 |
5 |
6 | Deleting this tab will delete all rules stored inside.
7 |
8 |
9 | Are you sure you want to delete the tab?
10 |
11 |
12 |
13 |
14 |
15 | No
16 | Yes
17 |
18 |
19 |
20 |
4 | The rule editor is where you create the rule definitions for all you forms.
5 |
6 |
7 | You can organize your rules into up to 6 tabs.
11 |
12 | Remove a tab (and its rules!) by clicking on the minus icon on the right of the tab.
15 |
--------------------------------------------------------------------------------
/src/js/content/context_menu.js:
--------------------------------------------------------------------------------
1 | /* global extractRules */
2 | var lastRightClickedElement = null;
3 | document.addEventListener("mousedown", function(event){
4 | // right click
5 | if (event.button === 2 && typeof event.target.form !== "undefined") {
6 | lastRightClickedElement = event.target;
7 | }
8 | }, true);
9 |
10 | // When we receive the message to extract a form
11 | // from bg.js we can just extract the form from the last saved element
12 | chrome.extension.onMessage.addListener(function(message) {
13 | if (message.action === "extractLastClickedForm") {
14 | extractRules(lastRightClickedElement.form);
15 | }
16 | });
17 |
--------------------------------------------------------------------------------
/src/js/background/alarm.js:
--------------------------------------------------------------------------------
1 | /* global Logger Utils */
2 | var Alarm = {
3 | create: function() {
4 | // Create an "alarm" which will be called every 15 minutes or so
5 | // https://developer.chrome.com/extensions/alarms
6 | chrome.alarms.clear(Utils.alarmName);
7 | Logger.info("[bg.js] Installing alarm to trigger every " + Utils.alarmIntervalInMinutes + " minutes");
8 | chrome.alarms.create(Utils.alarmName, { delayInMinutes: Utils.alarmIntervalInMinutes, periodInMinutes: Utils.alarmIntervalInMinutes});
9 | }
10 | };
11 |
12 | // REMOVE START
13 | if (typeof exports === "object") {
14 | module.exports = Alarm;
15 | }
16 | // REMOVE END
17 |
--------------------------------------------------------------------------------
/src/js/content/context.js:
--------------------------------------------------------------------------------
1 | /*global JSONF */
2 | /*eslint no-unused-vars: 0 */
3 | // This is not the same context as in background.js
4 | // Currently it only allows to read storage values set by bg.js but
5 | // you can set value for all value functions to access
6 | var context = {
7 | storage: {
8 | get: function(key) {
9 | var value = window.sessionStorage.getItem(key);
10 | if (typeof value !== "undefined") {
11 | return JSONF.parse(value);
12 | }
13 | return value;
14 | },
15 | set: function(key, value) {
16 | // set it in localstorage
17 | window.sessionStorage.setItem(key, JSONF.stringify(value));
18 | }
19 | }
20 | };
21 |
--------------------------------------------------------------------------------
/testcases/docroot-for-testing/form-o-fill-testing/22-complex.js:
--------------------------------------------------------------------------------
1 | /* global jQuery */
2 | jQuery(function() {
3 | jQuery(".clickme").on("click", function() {
4 | jQuery("form").append(
5 | '
2 |
Import workflows & rules
3 |
4 |
5 |
6 | Importing all data will replace all currently present workflows and rules.
7 |
8 |
9 |
11 |
12 | Form-O-Fill can only import JSON files. Please choose a JSON file.
13 |
14 |
15 |
16 |
17 |
18 | Close
19 | Import and replace everything
20 |
21 |
22 |
23 |
2 |
Import encrypted workflows & rules
3 |
4 |
5 |
6 | Importing all data will replace all currently present workflows and rules.
7 |
8 |
9 | Please enter the decryption password:
10 |
11 |
12 |
14 |
15 | Form-O-Fill was unable to decrypt the data. Sorry.
16 |
17 |
18 |
19 |
20 |
21 | Close
22 | Import and replace everything
23 |
24 |
25 |
26 |
4 | Form-O-Fill searches for matching rules whenever you visit a webpage or the URL changes.Automatic rematch ".
7 |
8 |
9 | If enabled Form-O-Fill will search for matching rules every two seconds.
10 |
11 |
12 | This is very useful for apps that change the DOM on the fly.automatic rematch is turned off.
14 |
15 | elements", function(done){
8 | Tests.visit("13-simple")
9 | .click("#form-o-fill-testing-import-submit")
10 | .pause(500)
11 | .getTagName(".popup-html li.select-rule", function (err, tagNames) {
12 | expect(tagNames.length).to.eql(10);
13 | })
14 | .call(done);
15 | });
16 |
17 | it("contains an link to the options page and the extract overlay", function (done){
18 | Tests.visit("13-simple")
19 | .getText(".popup-html a.cmd-show-extract-overlay", function (err, text) {
20 | expect(text).to.eql("Extract");
21 | })
22 | .getText(".popup-html a.to-options", function (err, text) {
23 | expect(text).to.eql("Options");
24 | })
25 | .call(done);
26 | });
27 | });
28 |
29 | describe("when no rules match", function() {
30 |
31 | it("contains a link to extract a rules", function (done){
32 | Tests.visit("06-no-matching-rules")
33 | .click("#form-o-fill-testing-import-submit")
34 | .pause(500)
35 | .getText(".popup-html h3", function (err, text) {
36 | expect(text).to.match(/Found no matching rules./);
37 | })
38 | .getText(".popup-html a.cmd-show-extract-overlay:first-child", function (err, text) {
39 | expect(text).to.eql("Create one ?");
40 | })
41 | .call(done);
42 | });
43 |
44 | });
45 | });
46 |
--------------------------------------------------------------------------------
/src/html/options/tutorial/_tour10_en.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 | Here you see the usage of the findHtml function.
8 |
9 |
10 | First it finds the selected input element.
11 |
12 |
13 | The function you put inside the .then() receives the HTML of the element as a string.
14 |
15 |
16 |
17 |
18 |
19 | The rule then fills the local variable direction with either left or right .
20 |
21 |
22 |
23 |
24 |
25 | Then it resolves the data as either {direction: "left"} or {direction: "right"}.
26 |
27 |
28 |
29 |
30 |
31 | The value function then prints the value.
32 |
33 |
34 | Last up is context.storage which is most useful in workflows.
35 |
36 |
37 | Please click here to open the last part .
38 |
39 |
40 |
41 |
Form-O-Fill Testpage
6 | TESTING SERVER RUNNING
10 |
11 |
12 | First input : "filled by original"
13 | Second input : "shared rule 2"
14 | Third input : "shared rule 3"
15 |
16 |
17 | Input field: Import
34 |
35 |
36 |
37 |
--------------------------------------------------------------------------------
/src/js/background/on_install.js:
--------------------------------------------------------------------------------
1 | /*global Utils Logger Rules Alarm loadSettings*/
2 | // Checks to see if tabSettings are initialized
3 | // If not creates a default tabSetting
4 | var initializeTabSettings = function() {
5 | // Check if tabs are saved or we start from scratch
6 | Storage.load(Utils.keys.tabs).then(function (tabSettings) {
7 | // No tab settings found, create one
8 | if (typeof tabSettings === "undefined") {
9 | Logger.info("[bg.js] Creating default tab setting");
10 | Storage.save([{
11 | "id": 1,
12 | "name": chrome.i18n.getMessage("tabs_default_name")
13 | }], Utils.keys.tabs);
14 |
15 | // Initialize rules
16 | Rules.save(Utils.defaultRule, 1);
17 | }
18 | });
19 | };
20 |
21 | // Fires when the extension is install or updated
22 | chrome.runtime.onInstalled.addListener(function (details) {
23 | Logger.info("[bg.js] chrome.runtime.inInstalled triggered");
24 |
25 | // Called on very first install
26 | if (details.reason === "install") {
27 | Notification.create(chrome.i18n.getMessage("first_install_notification"), null, function () {
28 | Utils.openOptions("#help");
29 | });
30 | }
31 |
32 | // Initialize tab settings
33 | initializeTabSettings();
34 |
35 | // remove log entries
36 | Logger.delete();
37 |
38 | // Check if there are notifications to display
39 | if (Utils.version.indexOf(".") > -1) {
40 | Notification.forVersion(Utils.version);
41 | }
42 |
43 | // load and set settings. Uses defaults if non present.
44 | loadSettings();
45 |
46 | // This will trigger a re-import of the remote rules set in settings
47 | Alarm.create();
48 | });
49 |
--------------------------------------------------------------------------------
/src/js/global/storage.js:
--------------------------------------------------------------------------------
1 | /*global Utils, Logger, JSONF */
2 | /* eslint no-undef: 0, no-unused-vars: 0 */
3 | var Storage = {
4 | load: function(keyToLoadFrom) {
5 | var key = keyToLoadFrom || Utils.keys.rules;
6 | return new Promise(function storageLoad(resolve) {
7 | chrome.storage.local.get(key, function prStorageLoad(persistedData) {
8 | Logger.debug("[storage.js] loaded '" + key + "'", JSONF.stringify(persistedData));
9 | resolve(persistedData[key]);
10 | });
11 | });
12 | },
13 | save: function (rulesCode, keyToSaveTo) {
14 | return new Promise(function (resolve, reject) {
15 | var value = {};
16 | var key = keyToSaveTo || Utils.keys.rules;
17 | value[key] = rulesCode;
18 | chrome.storage.local.set(value, function storageSave() {
19 | if (typeof chrome.runtime.lastError === "undefined") {
20 | Logger.debug("[storage.js] Saved '" + key + "'", JSONF.stringify(value[key]));
21 | resolve(true);
22 | } else {
23 | reject(new Error(chrome.runtime.lastError));
24 | }
25 | });
26 | });
27 | },
28 | delete: function (key) {
29 | return new Promise(function (resolve, reject) {
30 | chrome.storage.local.remove(key, function storageDelete() {
31 | if (typeof chrome.runtime.lastError === "undefined") {
32 | Logger.debug("[storage.js] Removed key '" + key + "'");
33 | resolve(true);
34 | } else {
35 | reject(new Error(chrome.runtime.lastError));
36 | }
37 | });
38 | });
39 | }
40 | };
41 |
42 | // REMOVE START
43 | if (typeof exports === "object") {
44 | module.exports = Storage;
45 | }
46 | // REMOVE END
47 |
--------------------------------------------------------------------------------
/src/html/options/tutorial/_tour1_en.html:
--------------------------------------------------------------------------------
1 |
2 |
3 | This is the rule editor.
4 |
5 |
6 |
7 |
8 | Here you can insert the rules you just extracted from the <form>
9 |
10 |
11 |
12 |
13 |
14 | When there are extracted rules present, you will see this notification.
15 |
16 |
17 | Pressing the "here" link in the notification will insert the extracted rules into the current tab.
18 |
19 |
20 | Do that now.
21 |
22 |
23 |
24 |
25 |
26 | The extracted rules are now copied to the rule editor.
27 |
28 |
29 |
30 |
31 |
32 | Pressing the "Format" button will tidy up those rules.
33 |
34 |
35 | Do that now.
36 |
37 |
38 |
39 |
40 |
41 | To finish press the "Save" button.
42 |
43 |
This concludes the tour of the simple form extraction in Form-O-Fill .
44 |
45 |
46 |
Capturing forms
3 |
4 | To capture the state of a form you are currently seeing follow these simple steps:
5 |
6 |
38 |
--------------------------------------------------------------------------------
/src/html/options/tutorial/_tour13_en.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 | The first rule defines two fields. This is basic Form-O-Fill.
8 |
9 |
10 |
11 |
12 |
13 | The rule for the second page uses the import keyword to reference the first rule.
14 |
15 |
16 | References are always the name of the rule.
17 |
18 |
19 | If you reference a non-existing rule the extension will complain :)
20 |
21 |
22 |
23 |
24 |
25 | You can place the import everywhere inside field definitions and they will be imported in place.
26 |
27 |
28 |
29 |
30 |
31 | If you want to you can also use multiple imports.
32 |
33 |
34 | Just queue them up as multiple{ "import": "some rule name" } blocks.
35 |
36 |
37 |
38 |
39 |
40 |
41 | Shared rules can remove duplication. We all like DRY don't we?
42 |
43 |
44 | That's all. Have fun.
45 |
46 |
47 |
48 |
Workflows
3 |
4 | Workflows allow you to chain rules together to form sequences of actions.
5 |
6 |
7 | While a single rule can fill forms on a single page, workflows continue to execute even after a
8 | page reload.
9 |
10 |
11 | Use the "" menu on the left side to create
12 | workflows and add existing rules in an arbitrary order.
15 |
16 | Notice that a workflow by itself doesn't submit any forms or changes or reloads the page url.
19 |
20 | Usually you can archieve this by using a value function that clicks
21 | on a link or button.
22 |
23 |
24 | Example rule that clicks on a submit button:
25 |
26 |
27 | {
28 | name: "a clicking rule",
29 | url: /some-url/,
30 | fields: [{
31 | selector: "form input[type=submit]",
32 | value: Libs.h.click
33 | }]
34 | }
35 |
36 |
37 | If you run a workflow and strange things happen (like you can't execute rules after that), try the
38 | Cancel stuck workflow button in the
39 | panel.
40 |
41 | Executing workflows
42 |
43 | Once you have defined a workflow it will be shown in the rules popup
44 | if the condition of the first rule in the workflow matches .
48 |
49 |
51 |
--------------------------------------------------------------------------------
/test/integration/options_scene.js:
--------------------------------------------------------------------------------
1 | require("../support/integration_helper");
2 |
3 | describe("the options panel", function () {
4 | this.timeout(9999);
5 |
6 | it("is contains all essential parts", function (done){
7 | Tests.visit("09-options")
8 | .click(".extension-options-url a")
9 | .pause(global.pause)
10 | .getValue("li.tab.current input", function (err, text) {
11 | expect(text).to.eql(["dummy", "Workflows", "Settings"]);
12 | })
13 | .isVisible("li.tab.more", function (err, isVisible) {
14 | // "More" tab
15 | expect(isVisible).to.eq(true);
16 | })
17 | .isVisible("#rules-overview", function (err, isVisible) {
18 | // Quickjump menu
19 | expect(isVisible).to.eq(true);
20 | })
21 | .isVisible(".menu button.save:first-child", function (err, isVisible) {
22 | // Action buttons
23 | expect(isVisible).to.eq(true);
24 | })
25 | .isVisible(".menu button.reload", function (err, isVisible) {
26 | expect(isVisible).to.eq(true);
27 | })
28 | .isVisible(".menu button.format", function (err, isVisible) {
29 | expect(isVisible).to.eq(true);
30 | })
31 | .getElementSize("#ruleeditor-ace", function (err, size) {
32 | // Editor window
33 | expect(size.height).to.be.above(200);
34 | expect(size.width).to.be.above(200);
35 | })
36 | .getText(".navigation .menu li", function (err, text) {
37 | // Navigation links
38 | expect(text).to.contain("Rule Editor");
39 | expect(text).to.contain("Workflows");
40 | expect(text).to.contain("Import / Export");
41 | expect(text).to.contain("Tutorials");
42 | expect(text).to.contain("About");
43 | expect(text).to.contain("Changelog");
44 | expect(text).to.contain("Settings");
45 | })
46 | .close()
47 | .call(done);
48 | });
49 |
50 | });
51 |
--------------------------------------------------------------------------------
/testcases/docroot-for-testing/form-o-fill-testing/21-reeval-rules.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Form-O-Fill Testpage
6 | TESTING SERVER RUNNING
10 |
11 |
12 | This demonstrates "automatic rematch".
13 |
14 | - Import
15 | - Deactivate (if active) "automatic rematch"
16 | - No matches
17 | - enable "autmatic rematch"
18 | - click "Insert target DOM element"
19 | - 1 match
20 | - click "Change URL"
21 | - 2 matches
22 |
23 |
24 | Insert target DOM element
25 | Change URL
26 |
27 | Import
49 |
50 |
51 |
52 |
53 |
54 |
55 |
56 |
--------------------------------------------------------------------------------
/src/sass/options.scss:
--------------------------------------------------------------------------------
1 | @font-face {
2 | font-family: 'formofill';
3 | src: url('../fonts/formofill.woff?-n1boxl') format('woff');
4 | font-weight: normal;
5 | font-style: normal;
6 | }
7 |
8 | body {
9 | font-family: 'Open Sans', Arial,sans-serif;
10 | color: #2c2c2c;
11 | margin: 0;
12 | padding: 10px;
13 | }
14 |
15 | .navigation h1:before {
16 | font-family: "formofill";
17 | content: "\e600";
18 | position: absolute;
19 | color: #d0d0d0;
20 | top: 7px;
21 | font-size: 3rem;
22 | z-index: -1;
23 | left: 40px;
24 | }
25 |
26 | .overlay .close-button {
27 | cursor: pointer;
28 | }
29 |
30 | .modalimport {
31 | display: none;
32 | }
33 |
34 | .only-json, .decryption-error {
35 | display: none;
36 | }
37 |
38 | #rules-overview {
39 | float: right;
40 | margin-top: 7px;
41 | }
42 |
43 | span.version {
44 | position: absolute;
45 | top: 20px;
46 | right: 10px;
47 | color: #ccc;
48 | display: block;
49 | }
50 |
51 | h3 span.unsaved-changes {
52 | float: right;
53 | font-size: 11px;
54 | color: Red;
55 | display: none;
56 | }
57 |
58 | .beta {
59 | color: #f00000;
60 | transform: rotate(45deg);
61 | position: absolute;
62 | }
63 |
64 | .unpacked-only {
65 | margin: 10px 0;
66 | }
67 |
68 | .modalimport {
69 | .content-sidebar {
70 | display: inline-block;
71 | padding-left: 15px;
72 | vertical-align: top;
73 |
74 | + .content-area {
75 | display: inline-block;
76 | }
77 | }
78 |
79 | .tldr {
80 | border: 1px solid #999;
81 | background-color: #eee;
82 | padding: 10px;
83 | }
84 |
85 | }
86 |
87 | @import "editor";
88 | @import "workflows";
89 | @import "help";
90 | @import "tabs";
91 | @import "tutorial";
92 | @import "notice";
93 | @import "chrome_bootstrap_overwrites";
94 | @import "introjs_overwrites";
95 | @import "changelog";
96 | @import "settings";
97 | @import "rule_summary";
98 | @import "import_export";
99 |
--------------------------------------------------------------------------------
/src/sass/_tabs.scss:
--------------------------------------------------------------------------------
1 | .tabcontainer {
2 | position: relative;
3 | width: 100%;
4 | }
5 |
6 | .tabs {
7 | border-bottom: 1px solid #ddd;
8 | width: 100%;
9 | }
10 |
11 | .tabs .tab {
12 | border-top: 1px solid #ddd;
13 | border-left: 1px solid #ddd;
14 | border-right: 1px solid #ddd;
15 | padding: 6px;
16 | display: inline-block;
17 | margin-left: 5px;
18 | margin-bottom: -1px;
19 | border-radius: 3px 3px 0 0;
20 | cursor: pointer;
21 | height: 21px;
22 | position: relative;
23 | }
24 |
25 | .tabs .tab:first-child {
26 | margin-left: 0
27 | }
28 |
29 | .tabs .tab input {
30 | cursor: pointer;
31 | width: 75px;
32 | color: #bbb;
33 | }
34 |
35 | .tabs .tab a {
36 | display: inline-block;
37 | text-decoration: none;
38 | vertical-align: middle;
39 | }
40 |
41 | .tabs .tab a:after {
42 | font-family: formofill;
43 | content: "\e609";
44 | font-size: 16px;
45 | margin-left: 6px;
46 | color: #bbb;
47 | }
48 |
49 | .tabs .tab:first-child a {
50 | visibility: hidden;
51 | }
52 |
53 | .tabs .tab a.edit {
54 | visibility: visible;
55 | }
56 |
57 | .tabs .tab a.edit:after {
58 | content: "\e603";
59 | color: #008000;
60 | }
61 |
62 | .tabs .tab a.edit:hover:after {
63 | content: "\e603";
64 | color: #008000;
65 | }
66 |
67 | .tabs .tab a:hover:after {
68 | color: #ddd;
69 | }
70 |
71 | .tabs .tab:last-child input {
72 | width: 10px;
73 | }
74 |
75 | .tabs .tab:last-child a:after {
76 | content: "\e606";
77 | }
78 |
79 | .tabs .tab.current {
80 | border-bottom: 1px solid #fff;
81 | .rule-count {
82 | color: #111;
83 | }
84 | }
85 |
86 | .tabs .tab.current input {
87 | color: #111
88 | }
89 |
90 | .tabs .tab input[type=text] {
91 | border: 0;
92 | padding: 0;
93 | }
94 |
95 | .tabs .tab .rule-count {
96 | vertical-align: top;
97 | font-size: 11px;
98 | margin-left: 5px;
99 | }
100 |
--------------------------------------------------------------------------------
/src/js/debug/logger.js:
--------------------------------------------------------------------------------
1 | var Logger = {
2 | storageKey: "form-o-fill-logs",
3 | out: function(level, msg, obj) {
4 | // Port to background.js
5 | if (typeof msg !== "undefined" && typeof obj !== "undefined") {
6 | console[level]("[*FOF*] %s %O", msg, obj);
7 | return;
8 | }
9 |
10 | if (typeof msg !== "undefined") {
11 | console[level]("[*FOF*] %s", msg);
12 | }
13 | },
14 | info: function(msg, obj) {
15 | this.out("info", msg, obj);
16 | },
17 | debug: function(msg, obj) {
18 | this.out("debug", msg, obj);
19 | },
20 | warn: function(msg, obj) {
21 | this.out("warn", msg, obj);
22 | },
23 | error: function(msg, obj) {
24 | this.out("error", msg, obj);
25 | },
26 | delete: function() {
27 | chrome.storage.local.remove(Logger.storageKey);
28 | },
29 | load: function() {
30 | return new Promise(function(resolve) {
31 | chrome.storage.local.get(Logger.storageKey, function(storage) {
32 | if (typeof storage[Logger.storageKey] === "undefined") {
33 | resolve([]);
34 | return;
35 | }
36 | resolve(storage[Logger.storageKey]);
37 | });
38 | });
39 | },
40 | _dateOptions: function() {
41 | return {
42 | year: "numeric",
43 | month: "numeric",
44 | day: "numeric",
45 | hour: "numeric",
46 | minute: "numeric",
47 | second: "numeric",
48 | hour12: false,
49 | };
50 | },
51 | store: function(msg) {
52 | this.load().then(function(entries) {
53 | var parts = msg.match(/\[(.*?)\](.*)/);
54 |
55 | entries = entries.slice(-25);
56 |
57 | if (parts !== null) {
58 | entries.push({
59 | createdAt: new Date().toLocaleString(),
60 | location: parts[1].trim(),
61 | message: msg,
62 | });
63 | }
64 |
65 | var a = {};
66 | a[Logger.storageKey] = entries;
67 | chrome.storage.local.set(a);
68 | });
69 | },
70 | };
71 |
--------------------------------------------------------------------------------
/src/vendor/ace/theme-clouds.js:
--------------------------------------------------------------------------------
1 | define("ace/theme/clouds",["require","exports","module","ace/lib/dom"],function(e,t,n){t.isDark=!1,t.cssClass="ace-clouds",t.cssText='.ace-clouds .ace_gutter {background: #ebebeb;color: #333}.ace-clouds .ace_print-margin {width: 1px;background: #e8e8e8}.ace-clouds {background-color: #FFFFFF;color: #000000}.ace-clouds .ace_cursor {color: #000000}.ace-clouds .ace_marker-layer .ace_selection {background: #BDD5FC}.ace-clouds.ace_multiselect .ace_selection.ace_start {box-shadow: 0 0 3px 0px #FFFFFF;}.ace-clouds .ace_marker-layer .ace_step {background: rgb(255, 255, 0)}.ace-clouds .ace_marker-layer .ace_bracket {margin: -1px 0 0 -1px;border: 1px solid #BFBFBF}.ace-clouds .ace_marker-layer .ace_active-line {background: #FFFBD1}.ace-clouds .ace_gutter-active-line {background-color : #dcdcdc}.ace-clouds .ace_marker-layer .ace_selected-word {border: 1px solid #BDD5FC}.ace-clouds .ace_invisible {color: #BFBFBF}.ace-clouds .ace_keyword,.ace-clouds .ace_meta,.ace-clouds .ace_support.ace_constant.ace_property-value {color: #AF956F}.ace-clouds .ace_keyword.ace_operator {color: #484848}.ace-clouds .ace_keyword.ace_other.ace_unit {color: #96DC5F}.ace-clouds .ace_constant.ace_language {color: #39946A}.ace-clouds .ace_constant.ace_numeric {color: #46A609}.ace-clouds .ace_constant.ace_character.ace_entity {color: #BF78CC}.ace-clouds .ace_invalid {background-color: #FF002A}.ace-clouds .ace_fold {background-color: #AF956F;border-color: #000000}.ace-clouds .ace_storage,.ace-clouds .ace_support.ace_class,.ace-clouds .ace_support.ace_function,.ace-clouds .ace_support.ace_other,.ace-clouds .ace_support.ace_type {color: #C52727}.ace-clouds .ace_string {color: #5D90CD}.ace-clouds .ace_comment {color: #BCC8BA}.ace-clouds .ace_entity.ace_name.ace_tag,.ace-clouds .ace_entity.ace_other.ace_attribute-name {color: #606060}.ace-clouds .ace_indent-guide {background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAACCAYAAACZgbYnAAAAE0lEQVQImWP4////f4bLly//BwAmVgd1/w11/gAAAABJRU5ErkJggg==") right repeat-y}';var r=e("../lib/dom");r.importCssString(t.cssText,t.cssClass)})
--------------------------------------------------------------------------------
/src/html/options/help-content/_help-setupcontent_en.html:
--------------------------------------------------------------------------------
1 | Prepare the webpage for rule execution
3 |
4 | While before functions are useful for preparing data they cannot access the webpage the user is seeing (aka. content page).
7 |
8 | This is where setupContent comes into play. It is executed before the form filling starts in the context of the content page and thus has full access to the DOM.
9 |
10 |
11 |
12 |
13 |
14 |
15 | var rules = [{
16 |
17 |
20 |
21 |
22 |
23 | setupContent: function() {
24 |
25 |
29 |
30 | You can use jQuery here.
32 |
33 | jQuery(".some-dom-element").trigger("click");
34 |
35 |
38 |
39 | Or you can also use the
context object .
40 | It is
the same object as available in value functions.
41 |
42 |
43 | jQuery(".nice").val(context.storage.get("some-key-set-in-value-function"));
44 |
45 |
48 |
49 |
50 |
51 | }
52 |
53 |
56 |
57 |
58 |
59 | }];
60 |
61 |
64 | There also is a teardownContent method with the same call signature that is run after the rule finished executing.
65 |
66 |
--------------------------------------------------------------------------------
/src/html/options/help-content/_help-ownlibraries_en.html:
--------------------------------------------------------------------------------
1 | Creating your own library of functions
3 |
4 | Besides using moment.js and chance.js to create testdata you call always roll your own functions.
7 |
8 | This is how to create your own functions:
9 |
10 |
11 |
12 | Create a new tab and open up an array of objects:
13 |
14 |
15 | var libs = [{
16 |
17 |
19 |
20 | The name of the function. Later you can access this function via
21 | Libs.fName()
22 |
23 |
24 | export: "yourFunctionName",
25 |
26 |
28 |
29 | The functions code:
30 |
31 |
32 | lib: function () {
33 |
34 |
36 |
37 | Your code goes here...
38 |
39 |
40 | return "Hello from the library function 'yourFunctionName'";
41 |
42 |
44 |
45 |
46 |
47 |
48 | }
49 |
50 |
52 |
53 |
54 |
55 |
56 | }];
57 |
58 |
60 | All functions declared in this way (even those declared inside normal rules) are globally accessible.Libs.yourFunctionName().
62 |
63 |
64 | If you define a function with the same name multiple times it's quite unpredictable which one will get executed. So name you exports uniquely.
65 |
66 |
--------------------------------------------------------------------------------
/testcases/docroot-for-testing/form-o-fill-testing/25-trigger-dom-events.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Form-O-Fill Testpage
6 | TESTING SERVER RUNNING
10 |
11 | DOM Events need to be triggerd by FoF
12 |
13 |
16 |
17 |
18 | Import
50 |
52 |
61 |
62 |
63 |
--------------------------------------------------------------------------------
/src/html/options/tutorial/_tour3_en.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | This is how a value function looks like.
6 |
7 |
8 | Instead of using a simple value it defines a function.
9 |
10 |
11 |
12 |
13 |
14 | The value function will receive two parameters.
15 |
16 |
17 | The first is the DOM element that will be filled by the rule.
18 |
19 |
20 | In this case it is the <input type="text"> element.
21 |
22 |
23 | To make working with this element easier, Form-O-Fill will convert this native DOM element into a jQuery object so you can do things like
24 | $e.addClass("some-class");
25 |
26 |
27 |
28 |
29 |
30 | The second parameter (data) contains the data returned from before functions (See Tour 4)
31 |
32 |
33 | This can be used to fill the field with pre-generated or calculated data.
34 |
35 |
36 |
37 |
38 |
39 | Whatever you return from the value function will be filled into the form field.
40 |
41 |
42 | If you return null the field will be left untouched and will not be filled.
43 |
44 |
45 |
46 |
47 |
48 | That concludes tour 3 of the Form-O-Fill tutorials. See ya!
49 |
50 |
51 |
52 |
Found 10 matches<\/h3>/);
60 | });
61 |
62 | page.call(done);
63 |
64 | });
65 | });
66 |
--------------------------------------------------------------------------------
/testcases/docroot-for-testing/form-o-fill-testing/17-workflow-storage-1.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Form-O-Fill Testpage
6 | TESTING SERVER RUNNING 1
10 |
11 |
12 | This tests context.storage.set/get in before functions in a workflow.
13 |
14 | Click the blue workflow icon : reach 17-workflow-storage-2.html
15 | Input field content: "Set by workflow step 1"
16 |
17 |
18 |
22 | Rules Import:
23 | Import
52 |
53 |
54 |
55 |
--------------------------------------------------------------------------------
/src/html/options/help-content/_help-settingsremoterules_en.html:
--------------------------------------------------------------------------------
1 | Using remote rules setup by others
3 |
4 | If you want to use Form-O-Fill but do not want to write your own rules you can use rules written
5 | by others (eg. colleagues).
10 |
11 | Step 1: Have someone build the rules and workflows that you need locally inside
12 | Form-O-Fill.Step 2: Export those rules a .js fileStep 3: Put them on a server and make them accessible via http or httpsStep 4: Take the URL to the .js file and put it in the setting for
16 | "Activate remote rules import" Step 5: Press Validate and import and Form-O-Fill
18 | will report success or failure.
19 |
20 |
21 | Form-O-Fill will keep these rules in a separate storage and will auto-update those rules every
22 | ##Utils.alarmIntervalInMinutes## minutes.
24 |
25 | Those rules will then also be used when searching for rules and workflow matches.
28 | Using the on-click rules installer
30 |
31 | To make using remote rules even easier, you can use
32 | http://form-o-fill.github.io/import-remote-rules/
35 | to generate a link that will auto-install your remote rules.
36 |
37 |
38 | This makes it easier to pass on those remote rules and make them usable for users that might not
39 | find it easy to follow the steps mentioned above.
40 |
41 |
42 | Visiting the generated link will import the remote rules and display a notification in the top
43 | right corner with success or failure.
44 |
45 |
--------------------------------------------------------------------------------
/src/html/options/help-content/_help-iframe_en.html:
--------------------------------------------------------------------------------
1 | Selecting forms inside iframes
3 |
4 | If the form you want fill is contained inside an <iframe> you can use the within property
5 | of a field definition to scope the selector to the frame.
6 |
7 |
8 |
9 |
10 | var rules = [{
15 |
17 |
18 | Form-O-Fill will look for a <iframe> tag but you can use any
CSS selector here.
19 | Just make sure the
within selector matches
only one element.
20 |
21 |
22 | within: "iframe",
23 |
24 |
26 |
27 | The selector to be used inside the iframe.
28 |
29 |
30 | selector: "input[type=text]",
31 |
32 |
34 |
35 | The value to fill the field with.
36 |
37 |
38 | value: "Nyan Nyan Nyan",
39 |
40 |
42 |
43 |
44 |
45 |
46 | }]
47 |
48 |
50 |
51 |
52 |
53 |
54 | }];
55 |
56 |
58 | If you use within to access an iframe please be aware that the iframe must reside on the same domain as the main page.different domain is forbidden .
60 |
61 |
--------------------------------------------------------------------------------
/src/html/options/help-content/_help-filling_en.html:
--------------------------------------------------------------------------------
1 | Filling forms
3 |
4 | Filling forms is easy. When Form-O-Fill finds a matching rule or workflow for the site you are currently on, it will display the number of matches in it's button.
5 |
6 |
7 |
8 | If the number of matches is zero, the extension will display "n/a" (
10 |
11 | If the number of matches is one, the extension will display "1" (
14 |
15 | If there are multiple matches and you click on the Form-O-Fill button you will be presented with a popup where you can select (by clicking) the appropriate match.
16 |
18 |
19 | In case of an error
20 |
21 | Since you can use value or before functions there may be errors executing those when filling the form.
36 |
37 |
--------------------------------------------------------------------------------
/src/html/options/_help_en.html:
--------------------------------------------------------------------------------
1 |
4 |
5 |
6 | A highly programmable form filler for developers.
7 |
8 |
9 | Form-O-Fill is a tool from developers for developers so there is a some knowledge of javascript neccessary to work with this tool.
10 |
11 |
19 |
26 |
33 |
34 |
35 |
36 |
37 |
38 |
39 |
40 |
41 |
42 |
43 |
44 |
45 |
46 |
47 |
48 |
49 |
Form-O-Fill Testpage "); })
33 | .getValue("#target8", function (err, value) { expect(value).to.contain("set by shared rule"); })
34 | .getValue("#target10", function (err, value) { expect(value).to.contain("Form-O-Fill Testpage "); })
35 | .getValue("#target12", function (err, value) { expect(value).to.contain("teardownContent"); })
36 | .getValue("#target13", function (err, value) { expect(value).to.contain("was empty"); })
37 | .url().then(function(currentUrl) {
38 | expect(currentUrl.value).to.eql("http://localhost:9292/form-o-fill-testing/22-complex-2.html?");
39 | })
40 | .call(done);
41 | });
42 | });
43 |
--------------------------------------------------------------------------------
/src/js/background/changelog.js:
--------------------------------------------------------------------------------
1 | /*eslint no-unused-vars: 0 */
2 | var Changelog = {
3 | changes: {
4 | "2.0.0": {
5 | title: "2.0.0 : Workflows have arrived!",
6 | message: "Chain rules together to form sequences of actions. Even survives page reload!",
7 | target: "#workflows"
8 | },
9 | "2.2.1": {
10 | title: "FoF updated: Save data between rules!",
11 | message: "Save data between rule executions. Ideal for workflows.",
12 | target: "#help-before-context"
13 | },
14 | "2.2.2": {
15 | title: "FoF updated: Unified export/import!",
16 | message: "Unified export/import for rules & workflows. See changelog!",
17 | target: "#changelog"
18 | },
19 | "2.3.0": {
20 | title: "FoF updated: Live tutorials!",
21 | message: "Learn the features of FoF with the live tutorials. See options.",
22 | target: "#tutorials"
23 | },
24 | "2.3.1": {
25 | title: "FoF updated: More tutorials!",
26 | message: "Added tutorials for workflows, context and more. Have a look!",
27 | target: "#tutorials"
28 | },
29 | "2.4.0": {
30 | title: "FoF updated: Screenshot + onlyEmpty",
31 | message: "Take screenshots! Fill only empty fields!",
32 | target: "#help-screenshot"
33 | },
34 | "2.5.0": {
35 | title: "FoF updated: setupContent + auto. rematch",
36 | message: "prepare function for content! automatic rematch for SPAs!",
37 | target: "#changelog"
38 | },
39 | "2.6.0": {
40 | title: "FoF updated: remote rules import",
41 | message: "Import remote rules from any URL. Share your rules with your colleagues.",
42 | target: "#help-settingsremoterules"
43 | },
44 | "3.0.0": {
45 | title: "Major release 3.0",
46 | message: "Faster ruleset searching. Please read the blogpost.",
47 | target: "https://form-o-fill.github.io/releasing-version-3"
48 | },
49 | "4.0": {
50 | title: "Major release 4.0",
51 | message: "Removal of unwanted permission for compliance",
52 | target: "#changelog"
53 | }
54 | },
55 | findForVersion: function(version) {
56 | if (typeof this.changes[version] !== "undefined") {
57 | return this.changes[version];
58 | }
59 | return null;
60 | }
61 | };
62 |
--------------------------------------------------------------------------------
/testcases/docroot-for-testing/form-o-fill-testing/24-auto-reload.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Form-O-Fill Testpage
6 | TESTING SERVER RUNNING
10 |
11 |
12 | This runs a single rule continously until the field is submitted with the value "10"
13 | in which case it will redirect to "01-all-types.html"
14 |
15 |
16 |
20 |
21 | Rules Import:
48 | Import
49 |
50 |
51 |
52 |
53 |
63 |
64 |
65 |
--------------------------------------------------------------------------------
/testcases/docroot-for-testing/form-o-fill-testing/07-only-empty-flag.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Form-O-Fill Testpage
6 | TESTING SERVER RUNNING
11 |
12 |
13 | 1. Click "Usage of onlyEmpty in rule" -> Fill empty input field.
14 | 2. Click "Usage of onlyEmpty in field definition" -> Fill empty input field.
15 |
16 |
17 | Empty field: Import
43 |
44 |
45 |
--------------------------------------------------------------------------------
/testcases/docroot-for-testing/form-o-fill-testing/20-teardown-content.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Form-O-Fill Testpage
6 | TESTING SERVER RUNNING
10 |
11 |
12 | This demonstrates:
13 | - usage of setupContent
14 | - usage of context.storage in setupContent/teardownContent/value function
15 | - the fact that all three functions have the same context available
16 |
17 | #target: setBySetupContent
18 | #target2: setByValueFunction
19 | #target3: set by teardownContent
20 |
21 |
22 |
23 | #target: Import
47 |
48 |
49 |
50 |
51 |
--------------------------------------------------------------------------------
/testcases/docroot-for-testing/form-o-fill-testing/16-workflow-1.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Form-O-Fill Testpage
6 | TESTING SERVER RUNNING 1
10 |
11 |
12 | This test workflows.
13 |
14 | Click extension icon : Blue workflow step visible.
15 | Click Workflow : Quickly cycle from workflow-1.html to workflow-2.html to workflow-3.html
16 |
17 |
21 | Rules Import:
22 | Import
66 |
67 |
68 |
69 |
--------------------------------------------------------------------------------
/src/sass/_workflows.scss:
--------------------------------------------------------------------------------
1 | /* Workflows */
2 | #workflows .tab input {
3 | width: auto;
4 | }
5 |
6 | #workflows .menu {
7 | margin-top: 7px;
8 | }
9 |
10 | #workfloweditor {
11 | min-height: 100%;
12 | width: 800px;
13 | margin-top: 10px;
14 | border: 1px solid #909090;
15 | overflow: hidden;
16 | padding: 5px;
17 | }
18 |
19 | #workfloweditor .wf-name {
20 | width: 100%;
21 | }
22 |
23 | #workfloweditor select.rulelist {
24 | width: 80%;
25 | margin-right: 10px;
26 | }
27 |
28 | #workfloweditor li {
29 | padding: 0 0 5px 0;
30 | cursor: pointer;
31 | }
32 |
33 | #workfloweditor li {
34 | padding: 5px 5px 5px 0;
35 | cursor: move;
36 | background-color: #FAFAF7;
37 | margin-bottom: 5px;
38 | }
39 |
40 | #workfloweditor li:before {
41 | font-family: "formofill";
42 | font-size: 24px;
43 | vertical-align: middle;
44 | margin-right: 4px;
45 | content: "\e60b";
46 | }
47 |
48 | #workfloweditor li button {
49 | margin-left: 10px;
50 | }
51 |
52 | #workfloweditor button:before, .wf-all button:before, .wf-button-cancel:before, .icon:before {
53 | font-family: "formofill";
54 | font-size: 16px;
55 | vertical-align: middle;
56 | margin-right: 4px;
57 | }
58 |
59 | #workfloweditor .wf-delete-step:before {
60 | content: "\e609";
61 | }
62 |
63 | #workfloweditor .wf-add-step:before {
64 | content: "\e606";
65 | }
66 |
67 | .wf-add-wf:before {
68 | content: "\e608";
69 | }
70 |
71 | #workfloweditor .actions {
72 | overflow: hidden;
73 | }
74 |
75 | #workfloweditor .actions button {
76 | float: left;
77 | margin-right: 5px;
78 | }
79 |
80 | button.wf-button-save:before {
81 | content: "\e603";
82 | }
83 |
84 | button.wf-button-delete:before {
85 | content: "\e609";
86 | }
87 |
88 | .wf-button-cancel:before {
89 | content: "\e602";
90 | }
91 |
92 | button.wf-button-import:before {
93 | content: "\e604";
94 | }
95 |
96 | .wf-all select {
97 | min-width: 30%;
98 | }
99 |
100 | #workflows #notices {
101 | margin-top: 15px;
102 | }
103 |
104 | #workfloweditor li.has-error {
105 | color: Red;
106 | font-weight: bold;
107 | }
108 |
109 | #workfloweditor li.has-error span.has-error {
110 | margin-left: 15px;
111 | }
112 |
113 | .wf-cancel-hint {
114 | font-size: 10px;
115 | }
116 |
117 | .wf-options {
118 | text-align: right;
119 | padding-right: 10px;
120 | }
121 |
--------------------------------------------------------------------------------
/testcases/docroot-for-testing/form-o-fill-testing/10-screenshots.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Form-O-Fill Testpage
6 | TESTING SERVER RUNNING
10 |
11 |
12 | All rules : create/download a screenshot on disc.
13 | 1. "Screenshot (field def Libs)" : screenshot-libs-h.png
14 | 2. "Screenshot (field def automatic)" : fof-screenshot-tab-1-rule-0-field-0_Screenshot__field_def_automatic_.png
15 | 3. "Screenshot (field def save as)" : screenshot-save-as.png
16 | 4 ."Screenshot (rule def automatic)" : fof-screenshot-tab-1-rule-2-field-0_Screenshot__field_def_automatic_.png
17 |
18 | Input field: Import
37 |
38 |
39 |
40 |
--------------------------------------------------------------------------------
/src/html/options/_importexport_en.html:
--------------------------------------------------------------------------------
1 |
2 | Import / Export workflows and rules
3 |
4 |
5 |
6 |
7 | Imported
9 |
10 | The author of the rules you tried to import has only allowed the use as remote import URL.
13 |
14 |
15 |
16 |
Import / Export all data
17 | Import rules & workflows
18 | Export rules & workflows
19 |
20 |
21 |
22 | When comparing changed rules (eg. in you VCS) use this diffable export of the rules (not importable!)
23 |
24 |
25 |
26 | If you are looking for a quick way to pass your rules on to another form-o-fill user,
29 |
30 |
31 |
32 |
33 |
Export all data in encrypted format
34 |
35 | You can export the rules and workflows in an encrypted format (AES encrypted ).
36 |
37 |
38 | To do that enter the encryption password here:
39 |
40 |
41 |
44 | Password:
45 |
47 |
48 |
49 | Repeat:
50 |
52 |
53 |
54 | Limit export to be used only as remote import URL . The exported rules can not be imported directly.
56 |
57 |
58 | Export encrypted rules & workflows
59 |
--------------------------------------------------------------------------------
/test/global/i18n_spec.js:
--------------------------------------------------------------------------------
1 | var I18n = require("../../src/js/global/i18n.js");
2 |
3 | describe("I18n", function(){
4 |
5 | describe(".supportedLanguages", function() {
6 | it("includes english in the supported languages", function(){
7 | expect(I18n.supportedLanguages()).to.include("en");
8 | });
9 | });
10 |
11 | describe(".current_locale", function() {
12 | it("returns the default locale if the user locale isn't covered", sinon.test(function(){
13 | global.chrome.setConfig("uiLanguage", "xy_zz");
14 | expect(I18n.currentLocale()).to.eql("en");
15 | }));
16 |
17 | it("returns the default locale if the user locale isn't covered", sinon.test(function(){
18 | this.stub(I18n, "supportedLanguages").returns(["en", "de"]);
19 | global.chrome.setConfig("uiLanguage", "de_DE");
20 | expect(I18n.currentLocale()).to.eql("de");
21 | }));
22 | });
23 |
24 | describe(".userLocale", function() {
25 | it("returns the simplyfied version of the browser language", function(){
26 | global.chrome.setConfig("uiLanguage", "en_GB");
27 | expect(I18n.userLocale()).to.eq("en");
28 | });
29 |
30 | it("downcases the language", function(){
31 | global.chrome.setConfig("uiLanguage", "EN_GB");
32 | expect(I18n.userLocale()).to.eq("en");
33 | });
34 | });
35 |
36 | describe(".load_pages", function() {
37 |
38 | beforeEach(function() {
39 | sinon.stub(jQuery, "ajax").yieldsTo("success", "
");
40 | });
41 |
42 | afterEach(function() {
43 | jQuery.ajax.restore();
44 | });
45 |
46 | it("loads localized pages and triggers a custom event", sinon.test(function(){
47 | var triggerSpy = this.spy(jQuery.prototype, "trigger");
48 |
49 | I18n.loadPages(["about"]);
50 |
51 | expect(triggerSpy).to.have.been.calledWith("i18n-loaded", ["html/options/_about_en.html"]);
52 | }));
53 |
54 | it("inserts the loaded page into the DOM", sinon.test(function(){
55 | var spy = this.spy(I18n, "_getAndInsert");
56 |
57 | I18n.loadPages(["about"]);
58 |
59 | expect(spy).to.have.been.calledWith(["html", "options", "_about_en.html"], "#about");
60 | }));
61 |
62 | it("prefixes pages to be loaded", sinon.test(function(){
63 | var triggerSpy = this.spy(jQuery.prototype, "trigger");
64 |
65 | I18n.loadPages(["about"], "prefix");
66 |
67 | expect(triggerSpy).to.have.been.calledWith("i18n-loaded", ["html/options/prefix/_about_en.html"]);
68 | }));
69 | });
70 | });
71 |
72 |
--------------------------------------------------------------------------------
/src/js/options/chrome_bootstrap.js:
--------------------------------------------------------------------------------
1 | /*global jQuery */
2 | /*eslint complexity: 0*/
3 | var ChromeBootstrap = {
4 | init: function() {
5 | // Menu functionality for chrome-bootstrap
6 | jQuery('.menu').on("click", "a", function(ev) {
7 | if (this.classList.contains("no-click")) {
8 | ev.preventDefault();
9 | return false;
10 | }
11 | jQuery('.mainview > *').removeClass("selected");
12 | jQuery('.menu li').removeClass("selected");
13 | jQuery('.mainview > *:not(.selected)').css('display', 'none');
14 |
15 | var $parent = jQuery(ev.currentTarget).parent();
16 | $parent.addClass("selected");
17 |
18 | var anchor = jQuery(ev.currentTarget).attr('href');
19 | var currentView = jQuery(anchor);
20 | currentView.css('display', 'block');
21 | currentView.addClass("selected");
22 |
23 | $parent.parent()[0].className = "menu " + anchor.substr(1);
24 |
25 | jQuery('body')[0].scrollTop = 0;
26 | return true;
27 | });
28 |
29 | // Activate navigationitem via hashtag
30 | jQuery(window).on("load", ChromeBootstrap.relocate);
31 |
32 | jQuery(document).on("click", "a", function() {
33 | if (this.href.indexOf("#help-") === -1) {
34 | return;
35 | }
36 | ChromeBootstrap.relocate(this.href.replace(/^.*#/, "#"));
37 | });
38 |
39 | jQuery(document).on("click", "a.activate-menu", ChromeBootstrap.relocate);
40 |
41 | jQuery(".menu a").on("click", function() {
42 | if (this.classList.contains("no-click")) {
43 | return false;
44 | }
45 |
46 | jQuery(".notice").hide();
47 | return true;
48 | });
49 | },
50 | relocate: function(target) {
51 | var hash = window.location.hash;
52 |
53 | // passed as a parameter
54 | if (typeof target === "string") {
55 | hash = target;
56 | }
57 |
58 | // User hash clicked on a link wit hcalss=activate-menu and only a #hash link
59 | if (typeof this.href !== "undefined") {
60 | var link = this.href.match(/#(.*)$/);
61 | if (link !== null) {
62 | hash = link[0];
63 | }
64 | }
65 |
66 | if (hash) {
67 | var main = hash.replace(/-.*$/, "");
68 | var sub = hash.replace(/^.*?-/, "");
69 | var $nav = jQuery(".navigation a[href='" + main + "']");
70 | if ($nav.length === 1) {
71 | $nav.trigger("click");
72 | }
73 |
74 | // Activate sub-item
75 | if (sub !== "") {
76 | window.location.hash = hash;
77 | }
78 | }
79 | }
80 | };
81 |
--------------------------------------------------------------------------------
/src/vendor/html5sortable/html.sortable.min.js:
--------------------------------------------------------------------------------
1 | "use strict";!function(a){var b,c,d=a();a.fn.sortable=function(e){var f=String(e);return e=a.extend({connectWith:!1,placeholder:null,dragImage:null},e),this.each(function(){var g,h=a(this).children(e.items),i=e.handle?h.find(e.handle):h;if("reload"===f&&a(this).children(e.items).off("dragstart.h5s dragend.h5s selectstart.h5s dragover.h5s dragenter.h5s drop.h5s"),/^enable|disable|destroy$/.test(f)){var j=a(this).children(a(this).data("items")).attr("draggable","enable"===f);return void("destroy"===f&&(a(this).off("sortupdate"),a(this).removeData("opts"),j.add(this).removeData("connectWith items").off("dragstart.h5s dragend.h5s dragover.h5s dragenter.h5s drop.h5s").off("sortupdate"),i.off("selectstart.h5s")))}var k=a(this).data("opts");"undefined"==typeof k?a(this).data("opts",e):e=k;var l,m,n=null===e.placeholder?a("<"+(/^ul|ol$/i.test(this.tagName)?"li":"div")+' class="sortable-placeholder"/>'):a(e.placeholder).addClass("sortable-placeholder");a(this).data("items",e.items),d=d.add(n),e.connectWith&&a(e.connectWith).add(this).data("connectWith",e.connectWith),h.attr("role","option"),h.attr("aria-grabbed","false"),i.attr("draggable","true").not("a[href], img").on("selectstart.h5s",function(){return this.dragDrop&&this.dragDrop(),!1}).end(),h.on("dragstart.h5s",function(d){var f=d.originalEvent.dataTransfer;f.effectAllowed="move",f.setData("text",""),e.dragImage&&f.setDragImage&&f.setDragImage(e.dragImage,0,0),g=(b=a(this)).addClass("sortable-dragging").attr("aria-grabbed","true").index(),c=b.outerHeight(),l=a(this).parent(),b.parent().triggerHandler("sortstart",{item:b,startparent:l})}).on("dragend.h5s",function(){b&&(b.removeClass("sortable-dragging").attr("aria-grabbed","false").show(),d.detach(),m=a(this).parent(),(g!==b.index()||l.get(0)!==m.get(0))&&b.parent().triggerHandler("sortupdate",{item:b,oldindex:g,startparent:l,endparent:m}),b=null,c=null)}).add([this,n]).on("dragover.h5s dragenter.h5s drop.h5s",function(f){if(!h.is(b)&&e.connectWith!==a(b).parent().data("connectWith"))return!0;if("drop"===f.type)return f.stopPropagation(),d.filter(":visible").after(b),b.trigger("dragend.h5s"),!1;if(f.preventDefault(),f.originalEvent.dataTransfer.dropEffect="move",h.is(this)){var g=a(this).outerHeight();if(e.forcePlaceholderSize&&n.height(c),g>c){var i=g-c,j=a(this).offset().top;if(n.index()a(this).index()&&f.originalEvent.pageY>j+g-i)return!1}b.hide(),a(this)[n.index()
2 |
3 |
4 | Form-O-Fill Testpage
6 |
10 | Inpage workflow 1:
11 | Both fields should be filled then a page change should occur followed by the fields 3+4 being filled.
12 |
13 |
14 | Target 1:Import
66 |
67 |
68 |
69 |
70 |
71 |
--------------------------------------------------------------------------------
/test/integration/all_types_scene.js:
--------------------------------------------------------------------------------
1 | /*eslint brace-style:0*/
2 | require("../support/integration_helper");
3 |
4 | describe("filling different types of fields", function() {
5 | this.timeout(99999);
6 |
7 | it("fills all known types", function (done) {
8 | Tests.visit("01-all-types")
9 | .getValue("input[type=text]", function (err, value) { expect(value).to.eql("input[type=text]"); })
10 | .isSelected("input[type=radio]", function (err, value) { expect(value).to.be_true; })
11 | .isSelected("input[name='checkbox-value']", function (err, value) { expect(value).to.eql(true); })
12 | .isSelected("input[name='checkbox-true']", function (err, value) { expect(value).to.eql(true); })
13 | .isSelected("input[name='checkbox-false']", function (err, value) { expect(value).to.eql(false); })
14 | .getValue("input[type=button]", function (err, value) { expect(value).to.eql("input[type=button]"); })
15 | .getAttribute("input[type=image]", "src", function (err, src) { expect(src).to.eql("http://localhost:9292/form-o-fill-testing/animage.png"); })
16 | .getValue("input[type=password]", function (err, value) { expect(value).to.eql("input[type=password]"); })
17 | .getValue("input[type=search]", function (err, value) { expect(value).to.eql("input[type=search]"); })
18 | .getValue("input[type=email]", function (err, value) { expect(value).to.eql("someone example.com"); })
19 | .getValue("input[type=url]", function (err, value) { expect(value).to.eql("http://form-o-fill.github.io"); })
20 | .getValue("input[type=tel]", function (err, value) { expect(value).to.eql("491234567890"); })
21 | .getValue("input[type=range]", function (err, value) { expect(value).to.eql("100"); })
22 | .getValue("input[type=date]", function (err, value) { expect(value).to.eql("2014-11-04"); })
23 | .getValue("input[type=month]", function (err, value) { expect(value).to.eql("2014-06"); })
24 | .getValue("input[type=week]", function (err, value) { expect(value).to.eql("2014-W42"); })
25 | .getValue("input[type=datetime]", function (err, value) { expect(value).to.eql("1996-12-19T16:39:57-08:00"); })
26 | .getValue("input[type=datetime-local]", function (err, value) { expect(value).to.eql("1996-12-19T16:39:57.123"); })
27 | .getValue("input[type=color]", function (err, value) { expect(value).to.eql("#ff0000"); })
28 | .getValue("select.single", function (err, value) { expect(value).to.eql("option1"); })
29 | .getValue("select.multiple option:checked", function (err, values) {
30 | expect(values).to.eql(['multiple1', 'multiple2']);
31 | })
32 | .getValue(".textarea", function (err, value) { expect(value).to.eql("textarea"); })
33 | .call(done);
34 | });
35 | });
36 |
--------------------------------------------------------------------------------
/testcases/docroot-for-testing/form-o-fill-testing/23-iframe-1.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Form-O-Fill Testpage
6 | TESTING SERVER RUNNING
10 |
11 | left iframe : value should be "value of outer frame"
12 | right iframe: value shouldn't change but should produce an error
13 |
14 | Outer field: Import
38 |
39 |
40 |
41 |
--------------------------------------------------------------------------------
/assets/ext-store/description.txt:
--------------------------------------------------------------------------------
1 | FORM-O-FILL is an advanced highly programmable form-filler.
2 |
3 | It provides form content extraction, one-click form filling, advanced multi-page workflows and more.
4 |
5 | Features:
6 | ✓ Extract already entered forms to auto-create the rule definition with the click of a button (or two).
7 | ✓ Use Javascript to program the rules.
8 | ✓ Use static values or dynamically generated values for every field (value functions are just javascript).
9 | ✓ Automatically take screenshots
10 | ✓ Get nice error reporting when applying the rule to the form doesn't work.
11 | ✓ Use before functions to fetch, generate and store data that can then be used in value functions.
12 | ✓ Organize your work into tabs. All tabs are searched for matching rules.
13 | ✓ Use workflows to create multi page rules.
14 | ✓ One click apply of a matching rule or even auto apply the rule.
15 | ✓ Two click apply when there are multiple matching rules or workflows.
16 | ✓ "Automatic execution" configurable for every rule.
17 | ✓ Reuse rules inside other rules (shared rules).
18 | ✓ Share rules via the remote URL import feature.
19 | ✓ Browser notifications to show you what happened.
20 |
21 | Requires:
22 | Chrome 49+
23 |
24 | ATTENTION!
25 | VERSION 4.0 doesn't require permissions to every visited page anymore.
26 | This was neccessary to comply with google's store rules ¯\_(ツ)_/¯
27 | If you are running into problems because of that please contact the author!
28 |
29 | Permissions requested:
30 | - Notifications (Show problems and extract notification)
31 | - Communicate with websites (Used for the live tutorials)
32 |
33 | ★ Version 4.0
34 | - Remove unwanted permission to keep FoF in the store.
35 | - Add a privacy policy to comply with chrome store regulations ("Strobe"). No data will be transfered anyway
36 | - Matching rules with "content" AND "url" is now possible
37 | - Remove all traces of the planned (but not implemented) workflow step delay
38 |
39 | ★ Version 3.9.2
40 | - Inline settings page to try to fix settings loading not working
41 |
42 | ★ Version 3.9.1
43 | - Extract input fields that have no type attribute
44 |
45 | ★ Version 3.9.0
46 | - Update jQuery to 3.3.1
47 | - Update chance.js to 1.0.16
48 | - Update math.js to 5.2.0
49 | - Update moment.js to 2.22.2
50 |
51 | ★ Version 1.1.1 - 3.8.3
52 | - See "Changelog" in extension options
53 |
54 | Find the source at
55 | https://github.com/form-o-fill/form-o-fill-chrome-extension
56 |
57 | Pull requests always welcome!
58 | Contact us at formofillextension@gmail.com
59 |
60 | Form-O-Fill icon taken from the Entypo Pictogram suite
61 | (http://www.entypo.com/)
62 |
63 | Licensed under the MIT license.
64 | The software shall be used for Good, not Evil.
65 |
--------------------------------------------------------------------------------
/src/js/global/rule.js:
--------------------------------------------------------------------------------
1 | /*global Logger, jQuery */
2 |
3 | /* A single Rule */
4 | var Rule = function() {
5 | this.prettyPrint = function() {
6 | var clone = jQuery.extend({}, this);
7 | delete clone.matcher;
8 | delete clone.nameClean;
9 | delete clone.urlClean;
10 | delete clone.id;
11 | delete clone.tabId;
12 | delete clone.type;
13 | delete clone.autorun;
14 | delete clone.screenshot;
15 | delete clone.onlyEmpty;
16 | delete clone.color;
17 | delete clone.shadow;
18 | delete clone._escapeForRegexp;
19 | delete clone.matchBoth;
20 | return JSON.stringify(clone, null, 2);
21 | };
22 |
23 | this._escapeForRegexp = function(str) {
24 | return str.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, "\\$&");
25 | };
26 | };
27 |
28 | /*eslint-disable complexity*/
29 | Rule.create = function(options, tabId, ruleIndex) {
30 | delete options.matcher;
31 | delete options.nameClean;
32 | delete options.urlClean;
33 | delete options._escapeForRegexp;
34 | delete options.prettyPrint;
35 | var rule = new Rule();
36 |
37 | Object.keys(options).forEach(function(key) {
38 | rule[key] = options[key];
39 | });
40 |
41 | // RegExp in URL or string?
42 | if (typeof rule.url !== "undefined" && typeof rule.url.test !== "undefined") {
43 | // RegExp
44 | rule.matcher = new RegExp(rule.url);
45 | } else if (typeof rule.url !== "undefined") {
46 | // String (match full url only)
47 | rule.matcher = new RegExp("^" + rule._escapeForRegexp(rule.url) + "$");
48 | }
49 |
50 | if (typeof rule.url !== "undefined") {
51 | rule.urlClean = rule.url.toString();
52 | } else {
53 | rule.urlClean = "n/a";
54 | }
55 |
56 | if (typeof rule.name !== "undefined") {
57 | rule.nameClean = rule.name.replace("<", "<");
58 | }
59 |
60 | if (typeof rule.id === "undefined") {
61 | rule.id = tabId + "-" + ruleIndex;
62 | }
63 |
64 | if (typeof rule.autorun === "undefined") {
65 | rule.autorun = false;
66 | }
67 |
68 | if (typeof rule.onlyEmpty === "undefined") {
69 | rule.onlyEmpty = false;
70 | }
71 |
72 | if (typeof rule.shadow === "undefined") {
73 | rule.shadow = false;
74 | }
75 |
76 | if (typeof rule.matchBoth === "undefined") {
77 | rule.matchBoth = false;
78 | }
79 |
80 | rule.tabId = tabId;
81 |
82 | // REMOVE START
83 | if (rule.export && rule.lib) {
84 | Logger.debug("[rule.js] created rule (with lib named '" + rule.export + "' )", rule);
85 | } else {
86 | Logger.debug("[rule.js] created rule", rule);
87 | }
88 | // REMOVE END
89 |
90 | return rule;
91 | };
92 | /*eslint-enable complexity*/
93 |
94 | // REMOVE START
95 | if (typeof exports === "object") {
96 | module.exports = Rule;
97 | }
98 | // REMOVE END
99 |
--------------------------------------------------------------------------------
/test/global/rule_spec.js:
--------------------------------------------------------------------------------
1 | var Rule = require("../../src/js/global/rule.js");
2 |
3 | describe("Rule", function() {
4 | describe("#prettyPrint", function() {
5 | it("returns a clean formatted representtion of a rule", sinon.test(function(){
6 | var rule = new Rule();
7 | rule.stays = 1;
8 | rule.matcher = "goes away";
9 | rule.nameClean = "goes away";
10 | rule.urlClean = "goes away";
11 | rule.id = "goes away";
12 |
13 | expect(rule.prettyPrint()).to.eql("{\n \"stays\": 1\n}");
14 | }));
15 | });
16 |
17 | describe(".create", function() {
18 | it("creates Rule instances", sinon.test(function(){
19 | var rule = Rule.create({name: "name"}, 1, 1);
20 | expect(rule).to.be.instanceof(Rule);
21 | }));
22 |
23 | it("assigns properties", sinon.test(function(){
24 | var rule = Rule.create({name: "name", something: true}, 1, 1);
25 | expect(rule.something).to.be.true;
26 | }));
27 |
28 | it("sets the 'matcher' attr to a RegExp when 'url' is a RegExp", sinon.test(function(){
29 | var rule = Rule.create({name: "name", url: /regexp/}, 1, 1);
30 | expect(rule.matcher).to.eql(/regexp/);
31 | }));
32 |
33 | it("sets the 'matcher' attr to a full URL matching RegExp if 'url' is string", sinon.test(function(){
34 | var rule = Rule.create({name: "name", url: "http://a?b=1&c=2"}, 1, 1);
35 | expect(rule.matcher).to.eql(/^http:\/\/a\?b=1&c=2$/);
36 | }));
37 |
38 | it("sets the 'urlClean' attr to a string representation of the 'url' attr", sinon.test(function(){
39 | var rule = Rule.create({name: "name", url: "http://a?b=1&c=2"}, 1, 1);
40 | expect(rule.urlClean).to.eql("http://a?b=1&c=2");
41 | }));
42 |
43 | it("sets the 'urlClean' attr to 'n/a' if the 'url' attr is undefined", sinon.test(function(){
44 | var rule = Rule.create({name: "name"});
45 | expect(rule.urlClean).to.eql("n/a");
46 | }));
47 |
48 | it("sets the 'nameClean' attr to a slightly escaped version of 'name'", sinon.test(function(){
49 | var rule = Rule.create({name: "with tag"});
50 | expect(rule.nameClean).to.eql("with <a> tag");
51 | }));
52 |
53 | it("sets the 'id' if not present", sinon.test(function(){
54 | var rule = Rule.create({name: "with tag"}, 1, 2);
55 | expect(rule.id).to.eql("1-2");
56 | }));
57 |
58 | it("doesn't set the 'id' if already present", sinon.test(function(){
59 | var rule = Rule.create({name: "with tag", id: "5-5"}, 1, 2);
60 | expect(rule.id).to.eql("5-5");
61 | }));
62 |
63 | it("sets the autorun property to false by default", sinon.test(function(){
64 | var rule = Rule.create({name: ""});
65 | expect(rule.autorun).to.be.false;
66 | }));
67 | });
68 | });
69 |
--------------------------------------------------------------------------------
/src/sass/popup.scss:
--------------------------------------------------------------------------------
1 | @font-face {
2 | font-family: 'formofill';
3 | src: url('../fonts/formofill.woff?-n1boxl') format('woff');
4 | font-weight: normal;
5 | font-style: normal;
6 | }
7 |
8 | [class^="icon-"]:before, [class*=" icon-"]:before {
9 | font-family: 'formofill';
10 | speak: none;
11 | font-style: normal;
12 | font-weight: normal;
13 | font-variant: normal;
14 | text-transform: none;
15 | -webkit-font-smoothing: antialiased;
16 | -moz-osx-font-smoothing: grayscale;
17 | }
18 |
19 | .icon-bucket:before {
20 | content: "\e600";
21 | }
22 |
23 | .icon-archive:before {
24 | content: "\e601";
25 | }
26 |
27 | .icon-cascade:before {
28 | content: "\e608";
29 | }
30 |
31 | html {
32 | width: 330px;
33 | min-height: 200px;
34 | min-width: 330px;
35 | margin: 0;
36 | padding: 0;
37 | }
38 |
39 | body {
40 | font-family: 'Open Sans', Arial,sans-serif;
41 | font-size: 13px;
42 | color: #2c2c2c;
43 | margin: 0;
44 | padding: 10px;
45 | min-height: 200px;
46 | min-width: 330px;
47 | }
48 |
49 | h3 {
50 | font-size: 14px;
51 | margin: 0 0 10px 0;
52 | padding: 0 0 10px 0;
53 | border-bottom: 1px solid #2d2c2c;
54 | }
55 |
56 | ul {
57 | margin: 0 0 15px 0;
58 | padding: 0;
59 | }
60 |
61 | li {
62 | list-style: none;
63 | padding: 5px 0 5px 5px;
64 | cursor: pointer;
65 | margin-left: 27px;
66 | text-indent: -27px;
67 | line-height: 18px;
68 | }
69 |
70 | li:hover {
71 | background-color: #ccc;
72 | }
73 |
74 | li:before {
75 | margin-right: 10px;
76 | vertical-align: middle;
77 | }
78 |
79 | li.select-workflow {
80 | color: #192E98;
81 | }
82 |
83 | .select-rule.from-shadow:after, .select-workflow.from-shadow:after {
84 | font-family: 'formofill';
85 | content: " (\e900)";
86 | }
87 |
88 | a, a:visited, a:hover, a:active {
89 | outline: none;
90 | color: #2c2c2c;
91 | border-bottom: 1px solid #2c2c2c;
92 | text-decoration: none;
93 | }
94 |
95 | .hidden {
96 | display: none;
97 | }
98 |
99 | a.cmd-show-extract-overlay {
100 | margin-left: 10px;
101 | }
102 |
103 | h3 .cmd-show-extract-overlay {
104 | font-size: inherit;
105 | float: none;
106 | margin-left: 0;
107 | }
108 |
109 | .actions {
110 | overflow: hidden;
111 | position: absolute;
112 | bottom: 0;
113 | right: 0;
114 | width: 100%;
115 | }
116 |
117 | .actions a {
118 | color: #333;
119 | font-size: 9px;
120 | float: right;
121 | margin: 0 10px 10px 0;
122 |
123 | &.on {
124 | color: #11C711;
125 | }
126 |
127 | &.off {
128 | color: Red;
129 | }
130 | }
131 |
132 | .actions .cmd-cancel-workflows {
133 | overflow: hidden;
134 | position: absolute;
135 | bottom: 0;
136 | left: 0;
137 | margin-left: 10px;
138 | float: left;
139 | }
140 |
--------------------------------------------------------------------------------
/testcases/docroot-for-testing/form-o-fill-testing/fof-complete-format-error.js:
--------------------------------------------------------------------------------
1 | {
2 | "rules": {
3 | "tabSettings": [
4 | {
5 | "id": "1",
6 | "name": "Library usage"
7 | },
8 | {
9 | "id": "3",
10 | "name": "Before Func"
11 | },
12 | {
13 | "id": "5",
14 | "name": "Basics"
15 | }
16 | ],
17 | "rules": [
18 | {
19 | "code": "var rules = [{\n url: /.*test.*/,\n name: \"Using the ENV in a before function\",\n before: function(resolve, env) {\n resolve(\"Hello ENV: \" + JSON.stringify(env));\n },\n fields: [{\n selector: \"input\",\n value: function(e, $data) {\n return $data;\n }\n }]\n}, {\n url: /.*test.*/,\n name: \"Error thrown in before function\",\n before: function(resolve, env) {\n throw new Error(\"error !\");\n resolve(\"never reached!\");\n },\n fields: [{\n selector: \"input\",\n value: \"throw error\"\n }]\n}, {\n url: /.*test.*/,\n name: \"undefined in before function\",\n before: function(resolve, env) {\n var a = env.notExisting.goAway;\n resolve(env.notExisting);\n },\n fields: [{\n selector: \"input\",\n value: \"undefined in before function\"\n }]\n}\n];",
20 | "tabId": 1
21 | },
22 | {
23 | "code": "var rules = [{\n url: /.*test.*/,\n name: \"Using the ENV in a before function\",\n before: function(resolve, env) {\n resolve(\"Hello ENV: \" + JSON.stringify(env));\n },\n fields: [{\n selector: \"input\",\n value: function(e, $data) {\n return $data;\n }\n }]\n}, {\n url: /.*test.*/,\n name: \"Error thrown in before function\",\n before: function(resolve, env) {\n throw new Error(\"error !\");\n resolve(\"never reached!\");\n },\n fields: [{\n selector: \"input\",\n value: \"throw error\"\n }]\n}, {\n url: /.*test.*/,\n name: \"undefined in before function\",\n before: function(resolve, env) {\n var a = env.notExisting.goAway;\n resolve(env.notExisting);\n },\n fields: [{\n selector: \"input\",\n value: \"undefined in before function\"\n }]\n}\n];",
24 | "tabId": 3
25 | },
26 | {
27 | "code": "var rules = [{\n content: /TESTING SERVER RUNNING/,\n name: \"Matching by content\",\n fields: [{\n selector: \"input\",\n value: \"found by content\"\n }]\n}, {\n url: /.*test.*/,\n name: \"Matching by URL\",\n fields: [{\n selector: \"input\",\n value: \"found by URL\"\n }]\n}, {\n url: /.*test.*/,\n name: \"Requesting external JSON\",\n before: function(resolve) {\n jQuery.getJSON(\"http://localhost:9292/form-o-fill-testing/json.json\").done(resolve);\n },\n fields: [{\n selector: \"input\",\n value: function($e, data) {\n return data.data;\n }\n }]\n}\n];",
28 | "tabId": 5
29 | }
30 | ]
31 | }
32 | }
33 |
--------------------------------------------------------------------------------
/testcases/docroot-for-testing/form-o-fill-testing/fof-complete.js:
--------------------------------------------------------------------------------
1 | {
2 | "workflows": [
3 | {
4 | "flags": {},
5 | "id": 1,
6 | "name": "A workflow",
7 | "steps": []
8 | }
9 | ],
10 | "rules": {
11 | "tabSettings": [
12 | {
13 | "id": "1",
14 | "name": "Library usage"
15 | },
16 | {
17 | "id": "3",
18 | "name": "Before Func"
19 | },
20 | {
21 | "id": "5",
22 | "name": "Basics"
23 | }
24 | ],
25 | "rules": [
26 | {
27 | "code": "var rules = [{\n url: /.*test.*/,\n name: \"Using the ENV in a before function\",\n before: function(resolve, env) {\n resolve(\"Hello ENV: \" + JSON.stringify(env));\n },\n fields: [{\n selector: \"input\",\n value: function(e, $data) {\n return $data;\n }\n }]\n}, {\n url: /.*test.*/,\n name: \"Error thrown in before function\",\n before: function(resolve, env) {\n throw new Error(\"error !\");\n resolve(\"never reached!\");\n },\n fields: [{\n selector: \"input\",\n value: \"throw error\"\n }]\n}, {\n url: /.*test.*/,\n name: \"undefined in before function\",\n before: function(resolve, env) {\n var a = env.notExisting.goAway;\n resolve(env.notExisting);\n },\n fields: [{\n selector: \"input\",\n value: \"undefined in before function\"\n }]\n}\n];",
28 | "tabId": 1
29 | },
30 | {
31 | "code": "var rules = [{\n url: /.*test.*/,\n name: \"Using the ENV in a before function\",\n before: function(resolve, env) {\n resolve(\"Hello ENV: \" + JSON.stringify(env));\n },\n fields: [{\n selector: \"input\",\n value: function(e, $data) {\n return $data;\n }\n }]\n}, {\n url: /.*test.*/,\n name: \"Error thrown in before function\",\n before: function(resolve, env) {\n throw new Error(\"error !\");\n resolve(\"never reached!\");\n },\n fields: [{\n selector: \"input\",\n value: \"throw error\"\n }]\n}, {\n url: /.*test.*/,\n name: \"undefined in before function\",\n before: function(resolve, env) {\n var a = env.notExisting.goAway;\n resolve(env.notExisting);\n },\n fields: [{\n selector: \"input\",\n value: \"undefined in before function\"\n }]\n}\n];",
32 | "tabId": 3
33 | },
34 | {
35 | "code": "var rules = [{\n content: /TESTING SERVER RUNNING/,\n name: \"Matching by content\",\n fields: [{\n selector: \"input\",\n value: \"found by content\"\n }]\n}, {\n url: /.*test.*/,\n name: \"Matching by URL\",\n fields: [{\n selector: \"input\",\n value: \"found by URL\"\n }]\n}, {\n url: /.*test.*/,\n name: \"Requesting external JSON\",\n before: function(resolve) {\n jQuery.getJSON(\"http://localhost:9292/form-o-fill-testing/json.json\").done(resolve);\n },\n fields: [{\n selector: \"input\",\n value: function($e, data) {\n return data.data;\n }\n }]\n}\n];",
36 | "tabId": 5
37 | }
38 | ]
39 | }
40 | }
--------------------------------------------------------------------------------
/assets/uml/plantuml-what-happens-when-page-is-visited.txt:
--------------------------------------------------------------------------------
1 | @startuml
2 | title What happens in Form-O-Fill\nwhen a website is visited?
3 | (*) --> "User Visits page"
4 |
5 | "User Visits page" --> "runWorkflowOrRule()"
6 | note right
7 | In background.js triggered by
8 | tab.addListener or tab.onUpdated
9 | end note
10 |
11 | "runWorkflowOrRule()" --> "onTabReadyWorkflow()"
12 | note right
13 | Check if a workflow is active and runs the step
14 | end note
15 |
16 | if "WF active?" then
17 | if " End of WF reached?"
18 | --> [Yes] "Clear current workflow"
19 | --> Set status = finished
20 | --> Return
21 | else
22 | -right-> [No] "Load Rule to be executed"
23 | if "Rule is undefined?" then
24 | note right
25 | Can happen if the user
26 | deletes a rule that is
27 | used in a WF
28 | end note
29 | -right-> [Yes] Set status = "rule_not_found"
30 | --> "Set runRules = false" as rr1
31 | --> "Clear current workflow" as clear2
32 | --> Return
33 | else
34 | --> [No] FormUtil.applyRule
35 | --> Save currentStep
36 | --> Set status = running_workflow
37 | --> "Set runRules = false" as rr2
38 | --> Return
39 | endif
40 | endif
41 | else
42 | --> [No] "onTabReadyRules()"
43 | --> Clear popup HTML
44 | --> Read active tab
45 | --> lastMatchingRules = []
46 | if "Tab active?" then
47 | --> [Yes] "Load all rules"
48 | --> Select those with "content" matcher attr
49 | --> Match every "content" rule
50 | note right
51 | action: "matchContent" -> content.js
52 | end note
53 | --> lastMatchingRules += "content" rules
54 | --> Match "url" rules
55 | --> lastMatchingRules += "url" rules
56 | --> save lastMatchingRules to Storage
57 | note right
58 | This is done so that
59 | popup.js can load them
60 | end note
61 | --> Find workflows matching lastMatchingRules
62 | note right
63 | Match rule against the
64 | first step of the workflows
65 | end note
66 | --> Save WF matches to storage
67 | note right
68 | This is done so that
69 | popup.js can load them
70 | end note
71 | --> refresh match counter in ext. button
72 | note right
73 | lastMatchingRules + matching WFs
74 | end note
75 | if "More than one rules found?" then
76 | --> [Yes] set HTML for popup window
77 | else
78 | if "autorun set on this rule?" then
79 | --> [Yes] "FormUtil.applyRule" as app2
80 | --> Return
81 | else
82 | --> [No] Return
83 | endif
84 | endif
85 |
86 | else
87 | --> [No] Return
88 | endif
89 | endif
90 |
91 | Return --> (*)
92 |
93 | @enduml
94 |
--------------------------------------------------------------------------------
/src/sass/_help.scss:
--------------------------------------------------------------------------------
1 | #help {
2 |
3 | p {
4 | line-height: 18px;
5 | }
6 |
7 | .topics a {
8 | display: inline-block;
9 | padding: 10px;
10 | background-color: #eee;
11 | margin-left: 10px;
12 | margin-top: 10px;
13 | text-decoration: none;
14 | color: #111;
15 | }
16 |
17 | .topics a:first-child {
18 | margin-left: 0;
19 | }
20 |
21 | .topics a.current {
22 | background-color: #ccc;
23 | }
24 |
25 | .topics a:hover {
26 | background-color: #ccc;
27 | }
28 |
29 | .topic {
30 | border-bottom: 1px solid #ccc;
31 | padding: 10px 0;
32 | line-height: 15px;
33 | }
34 |
35 | .topic h3 {
36 | font-size: 2em;
37 | }
38 |
39 | .topic > a[name] {
40 | margin-top: 60px;
41 | display: block;
42 | }
43 |
44 | .topic li .li-block {
45 | display: block;
46 | margin-left: 16px;
47 | }
48 |
49 | .topic li {
50 | text-indent: -14px;
51 | margin-left: 14px;
52 | margin-bottom: 5px;
53 | }
54 |
55 | .topic li:before {
56 | font-family: formofill;
57 | content: "\e600";
58 | margin-right: 6px;
59 | }
60 |
61 | .topic img {
62 | vertical-align: middle;
63 | padding: 5px;
64 | border: 1px solid #eee;
65 | border-radius: 3px;
66 | }
67 |
68 | .warning:before {
69 | font-family: "formofill";
70 | vertical-align: middle;
71 | content: "\e602";
72 | color: rgb(197, 25, 25);
73 | }
74 |
75 | code {
76 | background-color: #eee;
77 | border: 1px solid #ddd;
78 | border-radius: 3px;
79 | padding: 2px;
80 | }
81 |
82 | .block-of-code {
83 | overflow: hidden;
84 | line-height: 18px;
85 | margin-bottom: 1px;
86 | }
87 |
88 | .explaining {
89 | padding: 2px;
90 | float: left;
91 | width: 33%;
92 | background-color: #eee;
93 | font-size: 12px;
94 | margin-right: 10px;
95 | min-height: 24px;
96 | }
97 |
98 | .code {
99 | padding: 5px;
100 | float: right;
101 | font-family: monospace;
102 | width: 64%;
103 | }
104 |
105 | #help-importexport button {
106 | width: 200px;
107 | text-align: left;
108 | }
109 | #help-importexport .block {
110 | float: left;
111 | margin-left: 10px;
112 | }
113 |
114 | #help-importexport .block h3, #help-importexport .block .icon {
115 | color: #888;
116 | }
117 |
118 | #help-importexport .row {
119 | overflow: hidden;
120 | margin-bottom: 40px;
121 | }
122 |
123 | .topic > a[name].anchor {
124 | margin: 0;
125 | height: 0;
126 | }
127 |
128 | button.save:before {
129 | font-family: "formofill";
130 | font-size: 16px;
131 | vertical-align: middle;
132 | margin-right: 4px;
133 | }
134 |
135 | .anchor {
136 | position: relative;
137 | }
138 |
139 | .floating-hint {
140 | width: 38%;
141 | position: absolute;
142 | top: 0;
143 | right: 0;
144 | border: 1px solid #ddd;
145 |
146 | th {
147 | background-color: #eee;
148 | }
149 |
150 | td {
151 | padding: 5px 5px;
152 | }
153 | }
154 | }
155 |
156 |
--------------------------------------------------------------------------------
/src/js/global/jsonf.js:
--------------------------------------------------------------------------------
1 | /*eslint no-new-func:0, complexity: 0*/
2 | var JSONF = {
3 | // Codified value for "undefined"
4 | _undef: "**JSONF-UNDEFINED**",
5 | _es6ArrowFuncDetect: /\s+=>\s+/,
6 | // A regex for normal "function"
7 | _detectFuncRegex: /^function\s*(\w*)\s*\(([\s\S]*?)\)[\s\S]*?\{([\s\S]*)\}/m,
8 | // Regexes for es2015 arrow functions
9 | _detectArrowFuncRegex: /^\(?(.*?)\)?\s*=>\s*\{([\s\S]*?)\}(?!`)/,
10 | _detectArrowFuncImplRetRegex: /^\((.*?)\)\s*=>\s*([^;\n]*)/,
11 | // A regex for regexes
12 | _detectRegexpRegex: /^\/(.*?)\/$/m,
13 | // Better (formatted) stringify
14 | stringify: function(object) {
15 | return JSON.stringify(object, this._serializer, 2);
16 | },
17 | parse: function(jsonString) {
18 | return JSON.parse(jsonString, this._deserializer);
19 | },
20 | _serializer: function(key, value) {
21 | // undefined
22 | if (typeof value === "undefined") {
23 | return JSONF._undef;
24 | }
25 |
26 | // Is a FUNCTION (ES5 or ES6) or REGEXP ?
27 | if (value !== null && (typeof value === "function" || typeof value.test === "function")) {
28 | return value.toString();
29 | }
30 | return value;
31 | },
32 | _deserializer: function(key, value) {
33 |
34 | // Undefined?
35 | if (typeof value === "string" && value === JSONF._undef) {
36 | return undefined;
37 | }
38 |
39 | // Return simple value if...
40 | // 1. not a function
41 | // 2. not a regex
42 | // 3. not an es2015 arrow function
43 | if (key === "" && typeof value === "string" && value.indexOf("function") !== 0 && value.indexOf("/") !== 0 && JSONF._es6ArrowFuncDetect.test(value) === false) {
44 | return value;
45 | }
46 |
47 | if (typeof value === "string") {
48 | var match = value.match(JSONF._detectFuncRegex);
49 |
50 | // Function?
51 | if (match) {
52 | var args = match[2].split(',').map(function(arg) {
53 | return arg.replace(/\s+/, '');
54 | });
55 | return new Function(args, match[3].trim());
56 | }
57 |
58 | // ES2015 arrow function with brackets
59 | match = value.match(JSONF._detectArrowFuncRegex);
60 | if (match) {
61 | // 1: function arguments
62 | // 2: function body (without {})
63 | return new Function(JSONF.cleanArgs(match[1]), match[2].trim());
64 | }
65 |
66 | // ES2015 arrow function without brackets (implicit return)
67 | match = value.match(JSONF._detectArrowFuncImplRetRegex);
68 | if (match) {
69 | // 1: function arguments
70 | // 2: function body;
71 | return new Function(JSONF.cleanArgs(match[1]), "return " + match[2].trim());
72 | }
73 |
74 | // RegEx?
75 | match = value.match(JSONF._detectRegexpRegex);
76 | if (match) {
77 | return new RegExp(match[1]);
78 | }
79 | }
80 | return value;
81 | },
82 | cleanArgs: function(argsAsString) {
83 | return argsAsString.split(',').map(function(arg) {
84 | return arg.replace(/\s+/, '');
85 | });
86 | }
87 | };
88 | // REMOVE START
89 | if (typeof exports === "object") {
90 | module.exports = JSONF;
91 | }
92 | // REMOVE END
93 |
--------------------------------------------------------------------------------
/src/html/options/tutorial/_tour5_en.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
20 |
21 |
22 |
23 | To use the build-in libraries you need to use a value function (see tour 3) for the "value" entry.
24 |
25 |
26 |
27 |
28 |
29 | Here we read in the current value of the input field. We do that because we want to append to the current value.
30 |
31 |
32 |
33 |
34 |
35 | Here you see the call to change.js
36 |
37 |
38 | All libraries are available under the Libs namespace.
39 |
40 |
41 | This call to chance.name() returns a new random name.
42 |
43 |
44 | By returning the current plus the random value we tell Form-O-Fill to fill the input field with that combination.
45 |
46 |
47 | All available methods callable on Lib.chance are documented on the chance.js site (opens in a new tab) .
48 |
49 |
50 |
51 |
52 | Next let's look at what moment.js has to offer.
53 |
54 |
55 |
56 |
57 | Here we return the current date plus seven days and fill the input type=date field with it.
58 |
59 |
60 | As with chance.js the methods that moment.js has to offer are documented on their site .
61 |
62 |
63 |
64 |
65 |
66 | There is more to libraries in Form-O-Fill. You can even define your own libraries to make common functions available in multiple rules.
67 |
68 |
69 | That will be the topic of another tutorial. Until then, have fun!
70 |
71 |
72 |
73 |
2 |
3 |
20 |
21 |
22 |
23 | This rule has two field definitions.
24 |
25 |
26 |
27 |
28 |
29 | The first is for the input[type=text] field.
30 |
31 |
32 | Nothing new here.
33 |
34 |
35 |
36 |
37 |
38 | This field definition is more interesting.
39 |
40 |
41 | It specifies the input[type=submit] field as the target of the action.
42 |
43 |
44 |
45 |
46 |
47 | The value for this field definition is a function that simply clicks on the element it is targeted at thereby submitting the form.
48 |
49 |
50 |
51 |
52 |
53 | This is the common way to submit forms.
54 |
55 |
56 | Because writing that value function is tedious, Form-O-Fill has a helper function that simplifies the usage.
57 |
58 |
59 |
60 |
61 |
62 | I changed the rule to one using the helper function.
63 |
64 |
65 |
66 |
67 |
68 | Instead of writing a function() you can simply use Lib.h.click as the value for the "value" .
69 |
70 |
71 | Note the missing round brackets at the end.
72 |
73 |
74 |
75 |
76 |
77 | This is the most important feature you will need for workflows to function correctly.
78 |
79 |
80 | But that is a topic for later ...
81 |
82 |
83 | Until then ... enjoy!
84 |
85 |
86 |
87 |
) to the right of the location bar.
12 | 
16 | 
20 | Click the overlay of the form you want to extract.
21 | 
26 | 
50 | 
29 | 
).
12 | Depending on the setting for "Always show popup" clicking on the button will fill the matching form with the rule's data or show the popup.
13 | 
17 | 