Print a custom object on console in extjs - extjs

I am trying my hands on extjs 4.2.2 on a UI development. I am totally new to this. I am unable to understand how to print the objects for which i dont know the properties. Can someone please help me out in this.
If i know the property of the object i can do it as below.
console.log('print: ' + myObj.get('name'));
But if i dont know the property(in this case name) how can get to print it? Is there any way of iterating the object properties and print it. Kindly help me on this.

Yes, you can iterate through properties of an object using for .. in loop
for (var prop in obj) {
console.log("o." + prop + " = " + obj[prop]);
}
Another way would be to encode the object to string:
console.log(Ext.encode(o))
However, I usually log the complete object console.log(o) and the I use the console UI to browse through properties of interest.

In addition, you might want to consider installing the 'App Inspector for Sencha plugin' from the Google Chrome app store, its a free plug in from Sencha. Very handy, easy to use visual tool to peek under the hood and view components and their methods, properties and values, view what stores exist and the data in them, view the layout, view the events and record which events are getting triggered.
Also, worth considering is using Ext.ComponentQuery which I find very useful. I tend to use this directly in the web browser console window and in my EXTJS console.log statements.
These links will help explain ComponentQuery
http://training.figleaf.com/tutorials/senchacomplete/chapter2/lesson5/2.cfm
http://docs.sencha.com/extjs/4.2.2/#!/api/Ext.ComponentQuery
http://devjs.eu/en/how-to-use-ext-component-query-in-ext-js-4/

Related

How to get the TipTap Editor to recognize updated external state values

This is likely an issue with my inexperience using React generally, but I'd still greatly appreciate any insights.
I've added a commenting plugin to the TipTap editor.
When I create a new comment, it creates a DB record for the comment and I store that new comment in a state value (React) which is an array of all comments.
Then I return the ID which I use in a setComment (Mark) command that wraps the selection in a span with a commentId on the data-comment attribute.
When I click on that span, I can get the ID value, but the editor selectionUpdate function doesn't see the updated value. The page can access it fine, but that function can't see it until the page is reloaded.
How do I convince the editor to recognize the updated value in that function?
A minimal app demo can be found here:
Once you make a comment, and click on it, you'll see that it doesn't find the newly added comment. That's what I'm try to fix. It should be able to find it.
I understanding the the useEffect isn't being updated because the dependency array does not include chapterComments - but if I add it, then selectionUpdate runs multiple times and only the last one is accurate. I don't know how to appropriate destroy or update the editor instance - though I assume that's what I need to do.
The TipTap editor hook, const editor = useEditor, has it's own dependency array. Instead of trying to use useEffect with an editor dependency, just use the built in one for any values the editor needs to keep track of.
/facepalm

WinAppDriver - How do I get the list of properties available on an element

I am using Appium with WinAppDriver to control a WinForms / WPF application.
I am looking for a programmatic way to get the list of properties available on an element that has been retrieved.
My current thinking is to ask for the className and use this to look up a static dictionary of properties I have pre-configured.
var element = driver.FindElementByXPath(xPath);
var properties = element.getProperties(); // Is there something I can call here?
This is not the greatest solution but I figured I would mention it just in case someone else might find it useful:
It is possible to get the xml of the pagesource and look at the properties there. This can be accomplished by calling driver.PageSource which will return an xml string.
Hope someone finds this useful.
You can use element.GetAttribute("Value") to get the value. You can also use other attributes like LegacyState, Value.Value, IsEnabled, IsOffscreen, ControlType etc. You can catch hold of the list of attributes in Inspect.exe (UI access)that comes with windows tools

Microsoft UI Automation for Web Application

Has anyone tried "Microsoft UI Automation" for web application?
I have a WPF application which has a embedded wpfbrowser.
Since this is basically a desktop app, I cant use Selenium Webdriver.
I tried CodedUI but i am facing a issue, Which i have asked here:
Coded UI - Unable to identify a html controls on a Wpfbrowser
I am planning to use UIAutomation, But again itseems that i am unable to identify a control using id property
Ex:
<button id="but1">Click Me</button>
For this i have:
PropertyCondition ps = new PropertyCondition(AutomationElement.AutomationIdProperty, "but1");
AutomationElement Clickme = elementMainWindow.FindFirst(TreeScope.Descendants, ps);
But this is not working. "Clickme" is null.
How to do this is UIAutomation??
EDIT: Attaching a screeshot:
I would try actually navigating the tree view down to the control you are looking for instead of doing it based on decedents. Also another thing you could try is doing a retry loop if it is null. Here is an example of a generic Retry for FlaUI. So your code would look something like this.
PropertyCondition ps = new PropertyCondition(AutomationElement.AutomationIdProperty, "but1");
Func<AutomationElement> func = () => elementMainWindow.FindFirst(TreeScope.Descendants, ps);
Predicate<AutomationElement> retry = element => element == null;
AutomationElement clickMe = Retry.While<AutomationElement>(func, retry, TimeSpan.FromSeconds(1));
So this code will retry finding the element for 1 second and will retry finding it if the element comes back null or it exceptions. If either of those happens it waits 200 milliseconds and tries again. This will tell me if the elements are just not rendered when you try to find them or if their is a difference between how inspect finds them and how System.Windows.Automation is finding them.
If this doesn't work I will post a solution using the tree walker but I suggest using this solution over the tree walker because if this was an application others would want to write automation against they would expect these functions to work the way you are attempting to use them.
Not sure if <button id="but1"> equals with automationId. You can set automation id using AutomationProperties.AutomationId="but1" if you can use that namespace in the code where you define your UI (XAML), which is probaly only for WPF applications.
In your case if your UI defined in HTML I think you can use the button's caption.
So something like this.
var ps = new AndCondition(new PropertyCondition(AutomationElement.ControlTypeProperty, ControlType.Button),
new PropertyCondition(AutomationElement.NameProperty, "Click Me"));
AutomationElement Clickme = elementMainWindow.FindFirst(TreeScope.Descendants, ps);
ControlTypeProperty can help in filtering results by type. Not mandatory, but it can help if you have automation elements with different type, but with same name property.

How can I access the selector field of a By object?

I'm using Java, Selenium Webdriver in Eclipse.
I wrote a helper method to wait for an element present, scroll to it, wait for the element to be visible and click it. Here's what I have:
protected void waitScrollWaitClick(By by, String scroll)
{
wait.until(ExpectedConditions.presenceOfElementLocated(by));
getJse().executeScript("$('.mCustomScrollbar#" + scroll + "').mCustomScrollbar('scrollTo',document.querySelector(\"" + by.selector + "\"), {scrollInertia:0})");
wait.until(ExpectedConditions.visibilityOfElementLocated(by));
getDriver().findElement(by).click();
Now the issue I'm having is in that second line in the method. I am passing a By object. This works for the conventional Webdriver methods on lines 1,3,4. But since we are using a custom scrollbar for our web app, I need to use that JavascriptExecutor class (the getJse()) to scroll on the proper div #id (thus passing in the 'scroll' argument). To use that JSE I just need the CSS selector, not the whole By object. If I add a breakpoint and look, the By object contains a 'selector' field that has what I want (in Eclipse there's a red square icon with an 'F' on it), but I can't seem to access it. I tried with the "by.selector" in the code above, but that is a compile error.
How can use that selector field? I'm not Java expert, so maybe I'm missing something obvious. I guess I don't understand why I can stop on a breakpoint, see the By object I created in the Variables tab, expand the By object and see the 'selector' field I want, but just can't access it.
The easy answer is that you cannot get the CSS selector from a By type, or even WebElement type. This is because the WebElements themselves are found by the By class. In case the By specified was a xpath there would be no way to populate the CSS selector.
The long answer specifically for your issue, to get the CSS Selector would be to create it using Javascript. An example would be Florent B.'s answer here. However, I didn't tried myself and I have no idea if it works for all cases.
Now, to address the general issue, instead of using document.querySelector use document.getElementById in case your element has an id.
Or by using document.evaluate to get your element by xpath. You can find an example in the answer posted here.

Close method not working in Office

Im trying to use Microsoft.Office.Interop.Word._Document.Close() in a .net 3.5 windows form app.
No matter how much I search here and on Google I cannot find the correct parameters to put in the Close method.
I am using version 14.0.0.0 of Microsoft.Office.Interop.Word and I would like to close the document without saving and ideally ensure that the application can isolate the document thread so that users can still open word documents outside the running application.
See the Close method of the Document class described in MSDN. If you need to omit the parameter and use the default value - pass the Type.Missing parameter.
Try this:
object doNotSaveChanges = Word.WdSaveOptions.wdDoNotSaveChanges;
object missing = System.Reflection.Missing.Value;
_Document.Close(ref doNotSaveChanges, ref missing, ref missing);
This is the source
I'm not sure if you'll need the middle line or not. It's not from the original source it's from here

Resources