AppSuite:Debugging the UI - Revision history

Khgras at 10:02, 22 May 2017

2017-05-22T10:02:24Z

← Older revision		Revision as of 10:02, 22 May 2017
Line 1:		Line 1:
	~~<div class="title">Debugging the UI<~~/~~div>~~		The content on this page has moved to https://documentation.open-xchange.com/latest/ui/miscellaneous/debugging.html
	~~'''Synopsis:''' A collection of hints to debug during UI development~~. ~~See also [[AppSuite:UI FAQ]]~~. ~~Sister page: [[AppSuite:Debugging_the_server\|Debugging the server]]~~.

	~~__TOC__~~		Note: Open-Xchange is in the process of migrating all its technical documentation to a new and improved documentation system (documentation.open-xchange.com). Please note as the migration takes place more information will be available on the new system and less on this system. Thank you for your understanding during this period of transition.

	~~== What capabilities are available? ==~~
	~~<pre class="language~~-~~javascript">~~
	~~_(ox.serverConfig.capabilities).pluck("id").sort();~~
	~~</pre>~~
	~~== Is a specific capability set? ==~~
	~~<pre class="language-javascript">~~
	~~require(['io.ox/core/capabilities'], function (cap) {~~
	~~console.log(cap.has('certain_cap'));~~
	~~});~~
	~~</pre>~~

	~~== Which files failed to load? ==~~
	~~<pre class="language-javascript">~~
	~~requirejs.s.contexts._.registry~~
	~~</pre>~~

	~~== What portal widgets are available? ==~~
	~~<pre class="language-javascript">~~
	~~require(['io.ox/portal/widgets'], function (widgets) {~~
	~~console.log(widgets.getAvailablePlugins().sort());~~
	~~});~~
	~~</pre>~~

	~~== Check settings ==~~
	~~<pre class="language-javascript">~~
	~~// check core settings~~
	~~require('settings!io.ox/core').get();~~
	~~// check mail settings~~
	~~require('settings!io.ox/mail').get();~~
	~~</pre>~~

	~~== Clear all persistent caches ==~~
	~~Please mind that this does not clear~~ the ~~regular browser cache! It clears localStorage, IndexedDB, and WebSQL.~~
	~~<pre class="language-javascript">~~
	~~ox.cache.clear();~~
	~~</pre>~~

	~~== Clear~~ all ~~portal widgets ==~~
	~~Sometimes you manage~~ to ~~build~~ a ~~portal widgets that messes up all kinds of things when a user adds it~~. ~~This is a rather blunt way of solving the problem:~~

	~~<pre class="language~~-~~javascript">~~
	~~require(['settings!io~~.~~ox/portal'], function(settings~~) {
	~~settings~~.~~set('widgets/user', '').save();~~
	~~});~~
	~~</pre>~~

	~~== Debug relogin ==~~
	~~<pre class="language-javascript">~~
	~~ox.autoLogoutRestartDebug();~~
	~~</pre>~~

	~~== Enable/disable capability via URL hash ==~~
	~~Just add~~ the ~~parameter "cap" to URL hash. A leading minus disables a capability. Multiple capabilities separated by comma. Example:~~
	~~<pre language="none">~~
	~~...&cap=emoji,-calendar~~
	~~</pre>~~

	~~== Changes do not apply while developing ==~~
	~~You did changes in your code and they don't simply don't apply?~~
	~~There are several possibilites, you should check in order to find a solution.~~

	* Reload AppSuite with cleared Browser Cache. Using Firefox on ~~Linux-Distributions you can simply press <tt>Ctrl+F5</tt>. Please check~~ the ~~documentation of your Browser for Shortcuts~~ and ~~how to clear the cache.~~
	* Disable Source Caching. Therefor add the parameter <tt>"debug-js=true"</tt> to URL hash. Example:
	~~<pre language="none">..~~.~~&debug-js=true</pre>~~

	~~== Debug a specific folder ==~~
	If you ~~want to get details~~ of ~~a specific folder, just inspect it via dev tools and look for data-obj-id="...". Copy the id and run the following in console:~~
	~~<pre class="language-javascript">~~
	~~void require('io.ox/core/api/folder').get({ folder: 'default0/INBOX' }).always(_.inspect);~~
	~~</pre>~~

	~~== Finding the version ==~~
	If you want to know the backend and frontend versions with revision numbers, specifically when you simply cannot find it from the WebUI's About button as some customer hides it, then you can use the following command:
	~~<pre class="language-javascript">~~
	~~"Server version: " + ox.serverConfig.serverVersion + ", UI version: " + ox~~.~~version~~
	~~</pre>~~

	~~[[Category:AppSuite]]~~
	~~[[Category:UI]]~~
	~~[[Category:Developer]]~~

Usman.ahmad: /* Finding the version */

2014-08-01T14:50:34Z

Finding the version

← Older revision		Revision as of 14:50, 1 August 2014
Line 76:		Line 76:

	== Finding the version ==		== Finding the version ==
	If you want to the backend and ~~the~~ frontend ~~version~~ with revision numbers, specifically when you simply cannot find it from the WebUI's About button as some customer hides it, then you can use the following command:		If you want to know the backend and frontend versions with revision numbers, specifically when you simply cannot find it from the WebUI's About button as some customer hides it, then you can use the following command:
	<pre class="language-javascript">		<pre class="language-javascript">
	"Server version: " + ox.serverConfig.serverVersion + ", UI version: " + ox.version		"Server version: " + ox.serverConfig.serverVersion + ", UI version: " + ox.version

Usman.ahmad at 09:38, 31 July 2014

2014-07-31T09:38:35Z

← Older revision		Revision as of 09:38, 31 July 2014
Line 75:		Line 75:
	</pre>		</pre>

			== Finding the version ==
			If you want to the backend and the frontend version with revision numbers, specifically when you simply cannot find it from the WebUI's About button as some customer hides it, then you can use the following command:
			<pre class="language-javascript">
			"Server version: " + ox.serverConfig.serverVersion + ", UI version: " + ox.version
			</pre>

	[[Category:AppSuite]]		[[Category:AppSuite]]
	[[Category:UI]]		[[Category:UI]]
	[[Category:Developer]]		[[Category:Developer]]

J.ohny.b: /* Is a specific capability set? */

2014-07-23T08:13:05Z

Is a specific capability set?

← Older revision		Revision as of 08:13, 23 July 2014
Line 10:		Line 10:
	== Is a specific capability set? ==		== Is a specific capability set? ==
	<pre class="language-javascript">		<pre class="language-javascript">
	require('io.ox/core/capabilities').has('certain_cap');		require(['io.ox/core/capabilities'], function (cap) {
			console.log(cap.has('certain_cap'));
			});
	</pre>		</pre>

J.ohny.b: /* What capabilities are available? */

2014-07-23T08:11:57Z

What capabilities are available?

← Older revision		Revision as of 08:11, 23 July 2014
Line 8:		Line 8:
	_(ox.serverConfig.capabilities).pluck("id").sort();		_(ox.serverConfig.capabilities).pluck("id").sort();
	</pre>		</pre>
			== Is a specific capability set? ==
			<pre class="language-javascript">
			require('io.ox/core/capabilities').has('certain_cap');
			</pre>

	== Which files failed to load? ==		== Which files failed to load? ==
	<pre class="language-javascript">		<pre class="language-javascript">

Tierlieb at 12:34, 3 July 2014

2014-07-03T12:34:10Z

← Older revision		Revision as of 12:34, 3 July 2014
Line 1:		Line 1:
	<div class="title">Debugging the UI</div>		<div class="title">Debugging the UI</div>
	'''Synopsis:''' A collection of hints to debug during UI development. See also [[AppSuite:UI FAQ]].		'''Synopsis:''' A collection of hints to debug during UI development. See also [[AppSuite:UI FAQ]]. Sister page: [[AppSuite:Debugging_the_server\|Debugging the server]].

	__TOC__		__TOC__

DerCisco: Moving it to the UI FAQ

2014-05-26T08:52:50Z

Moving it to the UI FAQ

← Older revision		Revision as of 08:52, 26 May 2014
Line 68:		Line 68:
	</pre>		</pre>

	~~== After logging in I'm dumped back to the login page with a #autologin=false added to the URL ==~~

	~~You might not see an error message in the console then. Configure your JS console to preserve messages on navigation (so after a redirect), and you might get a hint as to what's wrong.~~

	[[Category:AppSuite]]		[[Category:AppSuite]]
	[[Category:UI]]		[[Category:UI]]
	[[Category:Developer]]		[[Category:Developer]]

DerCisco: Added hint

2014-05-26T08:52:07Z

Added hint

← Older revision		Revision as of 08:52, 26 May 2014
Line 67:		Line 67:
	void require('io.ox/core/api/folder').get({ folder: 'default0/INBOX' }).always(_.inspect);		void require('io.ox/core/api/folder').get({ folder: 'default0/INBOX' }).always(_.inspect);
	</pre>		</pre>

			== After logging in I'm dumped back to the login page with a #autologin=false added to the URL ==

			You might not see an error message in the console then. Configure your JS console to preserve messages on navigation (so after a redirect), and you might get a hint as to what's wrong.

	[[Category:AppSuite]]		[[Category:AppSuite]]
	[[Category:UI]]		[[Category:UI]]
	[[Category:Developer]]		[[Category:Developer]]

Tierlieb: /* Clear all persistent caches */

2014-05-05T14:02:19Z

Clear all persistent caches

← Older revision		Revision as of 14:02, 5 May 2014
Line 32:		Line 32:
	<pre class="language-javascript">		<pre class="language-javascript">
	ox.cache.clear();		ox.cache.clear();
			</pre>

			== Clear all portal widgets ==
			Sometimes you manage to build a portal widgets that messes up all kinds of things when a user adds it. This is a rather blunt way of solving the problem:

			<pre class="language-javascript">
			require(['settings!io.ox/portal'], function(settings) {
			settings.set('widgets/user', '').save();
			});
	</pre>		</pre>

Tierlieb at 12:16, 5 December 2013

2013-12-05T12:16:01Z

← Older revision		Revision as of 12:16, 5 December 2013
Line 1:		Line 1:
	<div class="title">Debugging the UI</div>		<div class="title">Debugging the UI</div>
	'''Synopsis:''' A collection of hints to debug during UI development		'''Synopsis:''' A collection of hints to debug during UI development. See also [[AppSuite:UI FAQ]].

	__TOC__		__TOC__

	== What capabilities are available? ==		== What capabilities are available? ==
	<pre class="language-javascript">		<pre class="language-javascript">
Line 56:		Line 58:
	void require('io.ox/core/api/folder').get({ folder: 'default0/INBOX' }).always(_.inspect);		void require('io.ox/core/api/folder').get({ folder: 'default0/INBOX' }).always(_.inspect);
	</pre>		</pre>

	~~== Does not load, fails with error: Could not read... ==~~
	~~"Could not read 'io.ox/core/http.js'"~~
	~~"Could not read 'io.ox/core/events.js'"~~
	That's not all, the system is probably hiding even more errors. It is more probable that the whole UI cannot be found. Check the com.openexchange.apps.path, usually hidden in manifests.properties. Does it point to where your webserver serves the files from? The default is /var/www/appsuite, on OSX is is more likely to be /Libraries/WebServer/Documents/appsuite

	~~== App Suite loads, but no apps show up ==~~
	So bother backend and frontend are devoid of errors, the UI loads nicely, you see the top bar with settings, notifications and refresh button but no apps at all, right? This is a manifest problem. Check the capabilities (see hint in the beginning of this page). If even those are correct, check the backend's /tmp folder and the manifest.properties there: Are the paths of <tt>com.openexchange.apps.path</tt> and <tt>com.openexchange.apps.manifestPath</tt> pointing to your build directory?

	[[Category:AppSuite]]		[[Category:AppSuite]]
	[[Category:UI]]		[[Category:UI]]
	[[Category:Developer]]		[[Category:Developer]]