Question:

I recently started to create custom theme for ExtJS 5 by Sencha.

Following <a href="http://docs.sencha.com/extjs/5.0.0/core_concepts/theming.html" rel="nofollow">http://docs.sencha.com/extjs/5.0.0/core_concepts/theming.html</a> I managed to create ThemeDemoApp, inherit ext-theme-neptune, change $base-color to green and refresh/rebuild ThemeDemoApp with my-custom-theme. All ok.

My problem is, <strong>ThemeDemoApp is quite poor for testing</strong> a custom theme. A panel, tab, button and a modal window. That's it?

After bit of googling I bumped into <a href="http://dev.sencha.com/ext/5.0.0/examples/themes/index.html" rel="nofollow">http://dev.sencha.com/ext/5.0.0/examples/themes/index.html</a>. (Why isn't this mentioned in the guide?!) Heading says: <strong>View and test every Ext component against bundled Ext Themes, or your own custom themes.</strong>

My question is: <strong>How?</strong> How do I test my own custom theme against this example? Do I have to dig into the source (themes.js) and build such page/application myself?

The examples - including the Theme tester - is included in the ExtJS download.

You can modify the list of themes available by editing the shared/options-toolbar.js file.

To get it to find your theme, you'll either need to name it similar to the others (ext-theme-name), or modify themes.js accordingly.

Or you could just hack the theme.js file to hardcode your theme.

(Ext JS 4 used to create an example page for themes automatically - it doesn't seem to do that now, though)

According to advice at <a href="https://stackoverflow.com/questions/950087/" rel="nofollow">How do I include a JavaScript file in another JavaScript file?</a> I decided to load both options-toolbar.js and themes.js (with just minor modification - commenting out Ext.onReady(...) function in themes.js) and I used functions getBasicPanel(), getCollapsedPanel(), etc. in my own application to create the same testing page (absolute-layout container that fits the page).

Anyhow, I guess Robert's answer is the correct one - there is no prearranged, ready-to-use functionality from Sencha :-(