siesta-lite
Version:
Stress-free JavaScript unit testing and functional testing tool, works in NodeJS and browsers
1 lines • 8.92 kB
JavaScript
Ext.data.JsonP.getting_started_sencha({"guide":"<h2 id='getting_started_sencha-section-introduction'>Introduction</h2>\n<div class='toc'>\n<p><strong>Contents</strong></p>\n<ol>\n<li><a href='#!/guide/getting_started_sencha-section-introduction'>Introduction</a></li>\n<li><a href='#!/guide/getting_started_sencha-section-specialized-classes'>Specialized classes</a></li>\n<li><a href='#!/guide/getting_started_sencha-section-actiontarget-extensions'>ActionTarget extensions</a></li>\n<li><a href='#!/guide/getting_started_sencha-section-sencha-touch-support'>Sencha Touch support</a></li>\n<li><a href='#!/guide/getting_started_sencha-section-advanced-setup'>Advanced setup</a></li>\n<li><a href='#!/guide/getting_started_sencha-section-buy-this-product'>Buy this product</a></li>\n<li><a href='#!/guide/getting_started_sencha-section-support'>Support</a></li>\n<li><a href='#!/guide/getting_started_sencha-section-see-also'>See also</a></li>\n<li><a href='#!/guide/getting_started_sencha-section-attribution'>Attribution</a></li>\n<li><a href='#!/guide/getting_started_sencha-section-copyright-and-license'>COPYRIGHT AND LICENSE</a></li>\n</ol>\n</div>\n\n<p>For the general information about using Siesta in browser environment, please refer to this\nguide <a href=\"#!/guide/getting_started_browser\">Getting started with Siesta in browser environment</a></p>\n\n<p>This guide describes the Siesta extensions, targeting the environment for testing <a href=\"https://www.sencha.com/\">Sencha</a> code.</p>\n\n<h2 id='getting_started_sencha-section-specialized-classes'>Specialized classes</h2>\n\n<p>The only difference with plain browsers setup, is that you need to use <a href=\"#!/api/Siesta.Project.Browser.ExtJS\" rel=\"Siesta.Project.Browser.ExtJS\" class=\"docClass\">Siesta.Project.Browser.ExtJS</a> class for project creation:</p>\n\n<pre><code>const project = new <a href=\"#!/api/Siesta.Project.Browser.ExtJS\" rel=\"Siesta.Project.Browser.ExtJS\" class=\"docClass\">Siesta.Project.Browser.ExtJS</a>();\n\nproject.configure({\n title : 'ExtJS test suite',\n\n preload : [\n '../../ext-6.5.2/build/classic/theme-triton/resources/theme-triton-all.css',\n '../../ext-6.5.2/build/ext-all-debug.js',\n '../../ext-6.5.2/build/classic/theme-triton/theme-triton.js'\n ]\n});\n\nproject.plan(\n '010_sanity.t.js',\n '020_basic.t.js'\n);\n\nproject.start();\n</code></pre>\n\n<p>The HTML wrapper file for the project does not change. There are several Sencha-specific configuration option, most important are:\n<a href=\"#!/api/Siesta.Project.Browser.ExtJS-cfg-waitForAppReady\" rel=\"Siesta.Project.Browser.ExtJS-cfg-waitForAppReady\" class=\"docClass\">waitForAppReady</a>, <a href=\"#!/api/Siesta.Project.Browser.ExtJS-cfg-requires\" rel=\"Siesta.Project.Browser.ExtJS-cfg-requires\" class=\"docClass\">requires</a>,\n<a href=\"#!/api/Siesta.Project.Browser.ExtJS-cfg-loaderPath\" rel=\"Siesta.Project.Browser.ExtJS-cfg-loaderPath\" class=\"docClass\">loaderPath</a>.</p>\n\n<p>The <code>StartTest</code> wrapper in the test file will receive an instance of the <a href=\"#!/api/Siesta.Test.ExtJS\" rel=\"Siesta.Test.ExtJS\" class=\"docClass\">Siesta.Test.ExtJS</a> class. This class contains various\nExtJS specific assertions.</p>\n\n<pre><code>StartTest(t => {\n\n t.it(\"Sanity\", t => {\n\n t.waitForCompositeQuery('mypanel => .x-body', () => {\n })\n\n t.matchGridCellContent(panel, 1, 3, \"cell text\", \"Correct text in the grid cell row = 1, column = 3\") \n });\n}) \n</code></pre>\n\n<p>Please refer to the documentation for the full list of supported assertions / helper methods.</p>\n\n<h2 id='getting_started_sencha-section-actiontarget-extensions'>ActionTarget extensions</h2>\n\n<p>When using <a href=\"#!/api/Siesta.Test.ExtJS\" rel=\"Siesta.Test.ExtJS\" class=\"docClass\">Siesta.Test.ExtJS</a> class, methods, that accepts target element / CSS query for user action simulation (like <code>click, type</code> etc),\nalso accept composite query - Siesta's extension for targeting DOM elements. Please refer to the <a href=\"#!/api/Siesta.Test.ExtJS-method-compositeQuery\" rel=\"Siesta.Test.ExtJS-method-compositeQuery\" class=\"docClass\">compositeQuery</a>\nmethod and <a href=\"#!/api/Siesta.Test.ActionTarget\" rel=\"Siesta.Test.ActionTarget\" class=\"docClass\">Siesta.Test.ActionTarget</a> for more information.</p>\n\n<h2 id='getting_started_sencha-section-sencha-touch-support'>Sencha Touch support</h2>\n\n<p>Sencha Touch framework is superseded by the Modern toolkit in the ExtJS, however testing Sencha Touch code is still supported.\nUse the <a href=\"#!/api/Siesta.Project.Browser.SenchaTouch\" rel=\"Siesta.Project.Browser.SenchaTouch\" class=\"docClass\">Siesta.Project.Browser.SenchaTouch</a> for the project class. The test class will be <a href=\"#!/api/Siesta.Test.SenchaTouch\" rel=\"Siesta.Test.SenchaTouch\" class=\"docClass\">Siesta.Test.SenchaTouch</a>.</p>\n\n<h2 id='getting_started_sencha-section-advanced-setup'>Advanced setup</h2>\n\n<p>For own user interface, which is loaded on the project page, Siesta uses an optimized build of ExtJS, compiled with Sencha Cmd.\nOnly the classes, actually used in the Siesta UI, are included in the \"siesta-all.js\" file. If you found that you need\nsome extra ExtJS class in your project file, you can use alternative setup, as shown below.\nNote, that Siesta UI requires ExtJS version 6.0.1 precisely.</p>\n\n<pre><code><!DOCTYPE html>\n<html>\n <head>\n <meta http-equiv=\"content-type\" content=\"text/html; charset=UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no\">\n\n <title>Sample project</title>\n\n <link rel=\"stylesheet\" type=\"text/css\" href=\"__SIESTA_FOLDER__/resources/css/siesta-all.css\">\n\n <script type=\"text/javascript\" src=\"__EXTJS_6.0.1_FOLDER__/build/ext-all-debug.js'\"></script>\n <script type=\"text/javascript\" src=\"__EXTJS_6.0.1_FOLDER__/build/classic/theme-triton/theme-triton.js\"></script>\n <script type=\"text/javascript\" src=\"__SIESTA_FOLDER__/siesta-no-ext-all.js\"></script>\n\n <script type=\"text/javascript\" src=\"index.js\"></script>\n </head>\n\n <body>\n </body>\n</html>\n</code></pre>\n\n<h2 id='getting_started_sencha-section-buy-this-product'>Buy this product</h2>\n\n<p>Visit our store: <a href=\"https://bryntum.com/store/siesta\">https://bryntum.com/store/siesta</a></p>\n\n<h2 id='getting_started_sencha-section-support'>Support</h2>\n\n<p>Ask question in our community forum: <a href=\"https://www.bryntum.com/forum/viewforum.php?f=20\">https://www.bryntum.com/forum/viewforum.php?f=20</a></p>\n\n<p>Subscribers can post expedited questions in Premium Forum: <a href=\"https://www.bryntum.com/forum/viewforum.php?f=21\">https://www.bryntum.com/forum/viewforum.php?f=21</a></p>\n\n<p>Please report any bugs through the web interface at <a href=\"https://www.assembla.com/spaces/bryntum/support/tickets\">https://www.assembla.com/spaces/bryntum/support/tickets</a></p>\n\n<h2 id='getting_started_sencha-section-see-also'>See also</h2>\n\n<p>Siesta web-page: <a href=\"https://bryntum.com/products/siesta\">https://bryntum.com/products/siesta</a></p>\n\n<p>Other Bryntum products: <a href=\"https://bryntum.com/products\">https://bryntum.com/products</a></p>\n\n<h2 id='getting_started_sencha-section-attribution'>Attribution</h2>\n\n<p>This software contains icons from the following icon packs (licensed under Creative Common 2.5/3.0 Attribution licenses)</p>\n\n<ul>\n<li><a href=\"http://www.famfamfam.com/lab/icons/silk/\">http://www.famfamfam.com/lab/icons/silk/</a></li>\n<li><a href=\"http://led24.de/iconset/\">http://led24.de/iconset/</a></li>\n<li><a href=\"http://p.yusukekamiyamane.com/\">http://p.yusukekamiyamane.com/</a></li>\n<li><a href=\"http://rrze-icon-set.berlios.de/index.html\">http://rrze-icon-set.berlios.de/index.html</a></li>\n<li><a href=\"http://www.smashingmagazine.com/2009/05/20/flavour-extended-the-ultimate-icon-set-for-web-designers/\">http://www.smashingmagazine.com/2009/05/20/flavour-extended-the-ultimate-icon-set-for-web-designers/</a></li>\n<li><a href=\"http://www.doublejdesign.co.uk/products-page/icons/super-mono-icons/\">http://www.doublejdesign.co.uk/products-page/icons/super-mono-icons/</a></li>\n<li><a href=\"http://pixel-mixer.com/\">http://pixel-mixer.com/</a></li>\n</ul>\n\n\n<p>Thanks a lot to the authors of the respective icons packs.</p>\n\n<h2 id='getting_started_sencha-section-copyright-and-license'>COPYRIGHT AND LICENSE</h2>\n\n<p>Copyright (c) 2009-2022, Bryntum & Nickolay Platonov</p>\n\n<p>All rights reserved.</p>\n","title":"Sencha environment"});