The Tapestry Inspector</> <para> Unlike scripting systems (such as JavaServer Pages and the like), Tapestry applications are gifted with a huge amount of information about how they are implemented. The same component object model that allows Tapestry to perform so many ordinary functions can be leveraged to provide some unusual functionality. </> <para> Run the Border tutorial from the previous chapter and click on the show inspector button (the circle with the italic "i"). A new window will launch, containing the Inspector: </> <figure> <title>Tapestry Inspector</> <mediaobject> <imageobject> <imagedata fileref="images/inspector/main.jpg" format="jpg"> </imageobject> </> </figure> <para> The Inspector displays live information from the running application; in fact, it is simply another part of the application (the drop-down list of pages will include the Inspector page itself). The Inspector is most often used to debug HTML generation by viewing the HTML templates. It is also very useful in debugging problems where the wrong data is displayed, since it the developer can quickly navigate to the particular components and see directly what properties are used. </> <section id="inspector.navigation"> <title>Navigation</> <para> The inspector allows the user to navigate to any page and any component on a page. The drop down list in the upper left corner lists all pages in the application; changing the selection immediately updates the Inspector. </> <para>Next to the drop down list is the component path; a list of nested component ids, starting with "page" to represent the page. Clicking on any id in the path changes the information displayed below. </> <para> Underneath the component navigation tools are a set of tab buttons for the different inspector views. </> </section> <section id="inspector.specification"> <title>Specification View</> <figure> <title>Specification View</> <mediaobject> <imageobject> <imagedata fileref="images/inspector/specification.jpg" format="jpg"> </imageobject> </> </figure> <para> The specification view shows four sets of information about the selected component. </> <section> <title>Basic Properties</> <para> First, are basic properties, such as the specification path and Java class. </> </section> <section> <title>Formal Parameters</> <para> Each formal parameter is displayed. Unbound parameters will show no value in the Binding column. </> </section> <section> <title>Informal Parameters</> <para> Beneath formal parameters are informal parameters (the <classname>Border</> component has none, so there is nothing to see). Informal parameters are usually mapped directly to HTML attributes. They are most often used with components that generate a single HTML tag, such as the <classname>Action</>, <classname>Direct</> or <classname>TextField</> components. </> </section> <section> <title>Embedded Components</> <para> On the right side is a list of each embedded component and its type. Clicking the comopnent id will navigate to the selected component. </> </section> </section> <section id="inspector.template"> <title>Template View</> <figure> <title>Template View</> <mediaobject> <imageobject> <imagedata fileref="images/inspector/template.jpg" format="jpg"> </imageobject> </> </figure> <para> The template view shows the HTML template for the component. It shows &jwc-tag; tags in bold, and makes the component id a clickable link (which navigates to the component, but maintains the Template View). This allows the developer to quickly drill down through the components. </> </section> <section id="inspector.properties"> <title>Properties View</> <figure> <title>Properties View</> <mediaobject> <imageobject> <imagedata fileref="images/inspector/properties.jpg" format="jpg"> </imageobject> </> </figure> <para> The properties view shows persistant properties stored by the page (or any components on the page). Most pages do not store any persistent state (it is more often stored in the application's visit object). The image above is from the Hangman demo, and shows how the game difficulty is stored between request cycles. </> </section> <section id="inspector.engine"> <title>Engine View</> <figure> <title>Engine View</> <mediaobject> <imageobject> <imagedata fileref="images/inspector/engine.jpg" format="jpg"> </imageobject> </> </figure> <para> The engine view shows information about the running application engine, as well as some details from the application specification. </> <para> Under Operations are two buttons: the first restarts the application. The second (when enabled <footnote> <para> By default, the reset service (used by the reset button) is disabled. To enable it, set the JVM system property <varname>com.primix.tapestry.enable-reset-service</> to true. </> </>) resets the application, which forces a reload of all component specifications and HTML templates. This is useful during development, since it allows for incremental development without stopping and restarting the servlet container. </> <para> Below the operations is a binary dump of the application engine. This is useful when developing to see how large the serialized state is, and perhaps gleam how it might be trimmed. </> <para> Further below (and not visible in the screen shot above), is a dump of the request context. This is that vast amount of data also displayed when an unexpected exception is thrown. </> </section> <section id="inspector.logging"> <title>Logging View</> <figure> <title>Logging View (Level Selection)</> <mediaobject> <imageobject> <imagedata fileref="images/inspector/logging-top.jpg" format="jpg"> </imageobject> </> </figure> <para> The Logging view allows dynamic integration with the <ulink url="http://jakarta.apache.org/log4j">Log4J</> logging framework. The top half of the page allows the logging level of any category to be dynamically set. This is useful when debugging, since logging output for specific classes <footnote> <para> By convention, logging categories match the complete class name of the corresponding class. All Tapestry logging categories conform to this convention. </> </> can be individually enabled or disable. </> <figure> <title>Logging View (Category Creation)</> <mediaobject> <imageobject> <imagedata fileref="images/inspector/logging-bottom.jpg" format="jpg"> </imageobject> </> </figure> <para> The bottom section is a second form, allowing new categories to be created. This can be useful to make broad changes in logging levels. For instance, creating a category "com.primix.tapestry" would allow the logging level of all Tapestry classes to be set in a single place. </> </section> </chapter>