



<script src="/lib/lodash/dist/lodash.js"></script>
<script src="/lib/platform/platform.js"></script>
<script src="/lib/benchmark/benchmark.js"></script>
<script src="/js/testrunner.js?v=uhhjlNf8Vw1G0SsjCNR5kDrchDwmF1nqr2pn9YS1pz0"></script>

    <span><script src="https://cdn.jsdelivr.net/npm/immer@3.1.3/dist/immer.umd.min.js"></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.min.js'></script></span>

<div id="validation-html-preparation"></div>

<script type="text/javascript">
    pageController = new TestRunnerController();
</script>
<textarea id="benchmark_definition_json" style="display:none">
    {&quot;ScriptPreparationCode&quot;:&quot;state =  {\r\n    \u0022id\u0022: \u00226679216102cebc200887401f\u0022,\r\n    \u0022name\u0022: \u0022New Form\u0022,\r\n    \u0022fields\u0022: [\r\n        {\r\n            \u0022id\u0022: \u0022e667921669aeeda3469cf2510\u0022,\r\n            \u0022fieldType\u0022: \u0022text\u0022,\r\n            \u0022value\u0022: \u0022\u003Cp style=\\\u0022text-align: left;\\\u0022\u003E\u003Cspan style=\\\u0022font-size: 40px;\\\u0022\u003E\u003Cstrong\u003EPhone Verification\u003C/strong\u003E\u003C/span\u003E\u003C/p\u003E\u0022,\r\n            \u0022styles\u0022: {\r\n                \u0022font-family\u0022: \u0022Inter\u0022,\r\n                \u0022margin\u0022: \u002210px 0\u0022,\r\n                \u0022font-weight\u0022: 400\r\n            },\r\n            \u0022subType\u0022: \u0022form-heading\u0022,\r\n            \u0022configs\u0022: {\r\n                \u0022data\u0022: []\r\n            }\r\n        },\r\n        {\r\n            \u0022id\u0022: \u0022e6679217e61efbbf6dda4ba02\u0022,\r\n            \u0022label\u0022: {\r\n                \u0022text\u0022: \u0022Phone Number\u0022,\r\n                \u0022alignment\u0022: \u0022left\u0022\r\n            },\r\n            \u0022fieldType\u0022: \u0022phone\u0022,\r\n            \u0022attributes\u0022: {\r\n                \u0022placeholder\u0022: \u0022e.g. 9769235488\u0022,\r\n                \u0022type\u0022: \u0022tel\u0022,\r\n                \u0022pattern\u0022: \u0022[0-9]{10}\u0022,\r\n                \u0022maxlength\u0022: 15,\r\n                \u0022required\u0022: true\r\n            },\r\n            \u0022configs\u0022: {\r\n                \u0022requireVerification\u0022: true,\r\n                \u0022proceedBtnText\u0022: \u0022OK\u0022,\r\n                \u0022repeatingCount\u0022: 1\r\n            },\r\n            \u0022mappedId\u0022: \u0022t1\u0022\r\n        },\r\n        {\r\n            \u0022id\u0022: \u0022e66792166fc8a7b2e45b324a3\u0022,\r\n            \u0022configs\u0022: {\r\n                \u0022captchaType\u0022: \u0022reCaptchaV3\u0022\r\n            },\r\n            \u0022fieldType\u0022: \u0022captcha\u0022\r\n        },\r\n        {\r\n            \u0022id\u0022: \u0022e66792166273f92becb49f156\u0022,\r\n            \u0022fieldType\u0022: \u0022button\u0022,\r\n            \u0022text\u0022: \u0022Submit\u0022\r\n        }\r\n    ],\r\n    \u0022fieldStyles\u0022: {\r\n        \u0022label\u0022: {\r\n            \u0022color\u0022: \u0022#4a4a4a\u0022,\r\n            \u0022text-transform\u0022: \u0022none\u0022,\r\n            \u0022text-shadow\u0022: \u00220px 0px 0px transparent\u0022,\r\n            \u0022font-size\u0022: \u002214px\u0022\r\n        },\r\n        \u0022input\u0022: {\r\n            \u0022color\u0022: \u0022#000\u0022,\r\n            \u0022box-shadow\u0022: \u00220px 0px 0px 0px #000\u0022,\r\n            \u0022font-weight\u0022: \u0022400\u0022,\r\n            \u0022font-size\u0022: \u002214px\u0022,\r\n            \u0022border-bottom-color\u0022: \u0022#e8e8e8\u0022,\r\n            \u0022border-bottom-width\u0022: \u00221px\u0022,\r\n            \u0022border-bottom-style\u0022: \u0022solid\u0022,\r\n            \u0022border-left-color\u0022: \u0022#e8e8e8\u0022,\r\n            \u0022border-left-style\u0022: \u0022solid\u0022,\r\n            \u0022border-left-width\u0022: \u00221px\u0022,\r\n            \u0022border-right-color\u0022: \u0022#e8e8e8\u0022,\r\n            \u0022border-right-style\u0022: \u0022solid\u0022,\r\n            \u0022border-right-width\u0022: \u00221px\u0022,\r\n            \u0022border-top-color\u0022: \u0022#e8e8e8\u0022,\r\n            \u0022border-top-style\u0022: \u0022solid\u0022,\r\n            \u0022border-top-width\u0022: \u00221px\u0022\r\n        },\r\n        \u0022helper\u0022: {\r\n            \u0022font-weight\u0022: \u0022normal\u0022,\r\n            \u0022font-size\u0022: \u002210px\u0022,\r\n            \u0022text-transform\u0022: \u0022none\u0022,\r\n            \u0022color\u0022: \u0022#fff\u0022\r\n        },\r\n        \u0022helper2\u0022: {\r\n            \u0022color\u0022: \u0022#000\u0022\r\n        }\r\n    },\r\n    \u0022folderId\u0022: null,\r\n    \u0022styles\u0022: {\r\n        \u0022border-top-color\u0022: \u0022#d9dfe8\u0022,\r\n        \u0022border-right-color\u0022: \u0022#d9dfe8\u0022,\r\n        \u0022border-bottom-color\u0022: \u0022#d9dfe8\u0022,\r\n        \u0022border-left-color\u0022: \u0022#d9dfe8\u0022,\r\n        \u0022border-top-style\u0022: \u0022solid\u0022,\r\n        \u0022border-right-style\u0022: \u0022solid\u0022,\r\n        \u0022border-bottom-style\u0022: \u0022solid\u0022,\r\n        \u0022border-left-style\u0022: \u0022solid\u0022,\r\n        \u0022border-top-width\u0022: \u00221px\u0022,\r\n        \u0022border-right-width\u0022: \u00221px\u0022,\r\n        \u0022border-bottom-width\u0022: \u00221px\u0022,\r\n        \u0022border-left-width\u0022: \u00221px\u0022,\r\n        \u0022box-shadow\u0022: \u00220px 0px 0px 0px #000\u0022\r\n    },\r\n    \u0022configs\u0022: {\r\n        \u0022defaultLanguage\u0022: \u0022en\u0022,\r\n        \u0022requireVerification\u0022: true,\r\n        \u0022activeTemplate\u0022: {\r\n            \u0022id\u0022: \u0022form-design-27\u0022,\r\n            \u0022name\u0022: \u0022form-design-27\u0022,\r\n            \u0022preview\u0022: \u0022https://assets.frms.link/templates/Form27.png\u0022,\r\n            \u0022configs\u0022: null\r\n        },\r\n        \u0022template\u0022: {\r\n            \u0022name\u0022: \u0022form-design-27\u0022,\r\n            \u0022configs\u0022: {}\r\n        },\r\n        \u0022enableWelcome\u0022: false,\r\n        \u0022enableThankyou\u0022: true,\r\n        \u0022inBrowserDataStorage\u0022: false,\r\n        \u0022thankyouIndex\u0022: 0,\r\n        \u0022verifyFirst\u0022: false,\r\n        \u0022mappedIdCount\u0022: {\r\n            \u0022t\u0022: 1,\r\n            \u0022n\u0022: 0,\r\n            \u0022d\u0022: 0,\r\n            \u0022m\u0022: 0\r\n        }\r\n    },\r\n    \u0022integrations\u0022: [],\r\n    \u0022thankyou\u0022: [\r\n        {\r\n            \u0022id\u0022: \u0022e6679216452b1c162a67c016a\u0022,\r\n            \u0022fieldType\u0022: \u0022image\u0022,\r\n            \u0022attributes\u0022: {\r\n                \u0022src\u0022: \u0022https://assets.frms.link/editor-assets/icons/tick-filled.svg\u0022\r\n            },\r\n            \u0022styles\u0022: {\r\n                \u0022width\u0022: \u002210%\u0022\r\n            }\r\n        },\r\n        {\r\n            \u0022id\u0022: \u0022e66792164f26f431d234a61b4\u0022,\r\n            \u0022fieldType\u0022: \u0022text\u0022,\r\n            \u0022value\u0022: \u0022\u003Cp style=\\\u0022text-align: center;\\\u0022\u003EYour submission has been successfully recorded\u003C/p\u003E\u0022,\r\n            \u0022styles\u0022: {\r\n                \u0022font-family\u0022: \u0022Inter\u0022,\r\n                \u0022margin\u0022: \u002210px 0\u0022,\r\n                \u0022font-size\u0022: \u002220px\u0022,\r\n                \u0022line-height\u0022: \u002220px\u0022\r\n            }\r\n        }\r\n    ],\r\n    \u0022welcome\u0022: [\r\n        {\r\n            \u0022id\u0022: \u0022e667921645f194b63eae7542e\u0022,\r\n            \u0022fieldType\u0022: \u0022text\u0022,\r\n            \u0022value\u0022: \u0022\u003Cp style=\\\u0022text-align: center;\\\u0022\u003E\u003Cspan style=\\\u0022font-size: 20pt;\\\u0022\u003EWelcome\u003C/span\u003E\u003C/p\u003E\u0022,\r\n            \u0022styles\u0022: {\r\n                \u0022font-family\u0022: \u0022Inter\u0022,\r\n                \u0022margin\u0022: \u002210px 0\u0022,\r\n                \u0022font-size\u0022: \u002220px\u0022,\r\n                \u0022line-height\u0022: \u002220px\u0022\r\n            }\r\n        }\r\n    ],\r\n    \u0022adminFields\u0022: [],\r\n    \u0022favouriteFields\u0022: [],\r\n    \u0022createdFrom\u0022: \u0022scratch\u0022\r\n}&quot;,&quot;TestCases&quot;:[{&quot;Name&quot;:&quot;Produce&quot;,&quot;Code&quot;:&quot;const result = immer.produce(state, draft =\u003E { draft.data.data1.data2 = \u0027updated\u0027 })&quot;,&quot;IsDeferred&quot;:false},{&quot;Name&quot;:&quot;CloneDeep&quot;,&quot;Code&quot;:&quot;const result = _.cloneDeep(state);\r\nresult.data.data1.data2 = \u0027updated\u0027;&quot;,&quot;IsDeferred&quot;:false}]}
</textarea>

<form style="display:none;" id="autoreload_form" action="/Benchmarks/TestFrameForValidationWithHtmlPrepCode?autostart=1" method="post">
    <input type="hidden" name="htmlPrepCode" id="htmlPrepCode">
</form>