-[Danny Chen]- Blog of an ASP.NET QA tester

I have a new blog: http://blogs.msdn.com/dannychen

dannychen — Wed, 08 Mar 2006 00:22:00 GMT

The ASP.NET weblogs are still using .Text which, frankly, is a bit annoying to work with and just plain 'old'. Pete LePage showed me the MSDN blogs which use the (much newer) Community Server 2.0 codebase so I'm going to switch to it. They look much cooler anyway. Hopefully my blog will still be syndicated on ASP.NET so the readers can keep up to date with my happenings.

In other news, you'll notice on the new blog that I'm now a "Visual Web Developer" tester as well. Actually, the truth is that after ASP.NET 2.0 shipped, I found it to be a prime opportunity to shift jobs and join the test team that is responsible for the GUI. While both teams are quite integrated, they are certainly distinct and have their own test methodologies. This is going to be a great experience and I really like my new team.

However, I can't seem to just let go of controls so I expect you'll continue to see posts from me about custom controls and navigation tricks as well as a strong forum presence.

Here is the new address: http://blogs.msdn.com/dannychen

IE7 Beta and VWD Style Builder.

dannychen — Mon, 06 Mar 2006 16:45:00 GMT

There's a bug in the IE7 beta which seems to break the style builder. Of course we'll work on getting it fixed but in the meantime, if you happen to have IE7 installed, there's a workaround you can apply.

Create a new DWORD reg-key named "devenv.exe" with the value "0" at the following location:

"HKLM\SOFTWARE\Microsoft\Internet Explorer\Main\FeatureControl\FEATURE_CSS_DATA_RESPECTS_XSS_ZONE_SETTING_KB912120"

Read more about it here: http://blogs.msdn.com/petel

Top results for the loading control challenge.

dannychen — Thu, 02 Mar 2006 18:00:00 GMT

Thank you everyone for sharing your code with me. There were quite a few excellent submissions and I learned a few things. Here are the top entries I received so far for the challenge. I'll add to this list if any more come in that I feel are worth mention.

crms -at- sima.com is an Elite ASP.NET hacker and submitted this solution:
http://weblogs.asp.net/dannychen/articles/439435.aspx

Raj Kaimal is an Elite ASP.NET hacker and submitted this solution:
http://weblogs.asp.net/dannychen/articles/439436.aspx
Raj also gets extra credit for coming up with a sample page using async tasks to demo his control.

Both of these are very fine solutions, but not quite perfect. Most critically, both run into an issue that I don't know if it can even be worked around. Intermittently, ASP.NET throws an error:

Session state has created a session id, but cannot save it because the response was already flushed by the application.

I talked with some dev's about this and they seem to think it's pretty cut-and-dry. Using Response.Flush pretty much causes this and can't really be worked around. And this can't really be done without Response.Flush.

Secondly, both are hardcoded to display a fixed message. It would be really nice if they were Templated instead to give the users flexibility in the display. This is a trivial amount of work, however...

None-the-less, I learned that this was indeed possible and in-fact, not that hard to do. Hopefully someone else will be able to benefit from these examples.

We are Hiring.

dannychen — Fri, 24 Feb 2006 18:52:00 GMT

Do you want to help make ASP.NET and Visual Studio even better in the next version? We are looking for the brightest and the most talented candidates to fill some challenging positions in our team. If you think you have the skills, guts, and determination to help improve the lives of web developers and shape web technology for the future, follow this link and submit your resume.

http://forums.asp.net/1197654/ShowPost.aspx

UPDATE: I've received quite a few submissions from people through comments or direct email. While I really appreciate the interest you've shown, unfortunately, I am not the hiring manager and therefore these decisions are not mine to make. So, I will not be able to respond to these posts or publish any of the submissions through feedback. If you're interested, you NEED to follow the link above.

A custom control challenge - make a page loading control that just works.

dannychen — Fri, 24 Feb 2006 18:37:00 GMT

It is a fairly well known technique to use Response.Buffer and Response.Flush to make a "please wait" or "Loading..." message appear when you know a page is going to take a while to load. So I was quite estatic when I read on ScottGu's blog that someone (Daniel Fisher) had done what I've wanted to do for a while: formalize this trick into a nice tidy custom control you can just drop onto a page. You can see it here: http://www.lennybacon.com/PleaseWaitBuildingAWaitScreenControlForASPNET.aspx. It is really a very slick control. However, there was one problem I couldn't (and still can't) figure out which stopped me from writing this control initially. When I look more closely at Daniel's code, I noticed that he hadn't solved this problem either.

The problem

How do you write the control so that it doesn't wrap a specific function but instead works against the natural page loading time itself. Here's a scenario to help describe what I mean. Lets say you develop a page with a couple GridView's and DetailsViews bound to SqlDataSource's. Everything works great in your mock up but as soon as you deploy it against your live data, you find that the page takes 2-8 seconds to load. It would be awesome if you could simple take this "loading ..." control, drop it onto your page and -bang- the functionality is added. Now, I know there's an easy solution using Daniels code and simple adding the DataBinding logic into his OnProcess method, but that's not the point. This should be a drag-and-drop solution.

The challenge

Create a custom control that provides similar functionality to Daniels but works against the page processing time. A "drag and drop" kind of solution. If you think you can do something that even I can't figure out how to do, please contact me through my blog and I will get back to you over email. I'll post the best submissions I receive and declare the submitters to be "Elite ASP.NET Hackers"

Saving unicode content with encoding

dannychen — Thu, 23 Feb 2006 19:07:00 GMT

Here's a quick tip that you may or may not know about. In Visual Studio (and possibly other MS programs) it's not enough to paste some unicode content into your file and then hit save. You'll also need to save it with the correct encoding. However, once you save the file with a particular encoding, it will continue to use that encoding until you switch it (this means you won't have to keep doing this for each save)

Here are the steps to do this:

simple choose file->save as
in the save-as dialog the "Save" button has a little pull down arrow.
Select this arrow and then choose "Save With Encoding"
This will open a dialog with a drop down that lists all the supported encodings.

Here are some screenshot to help out:

Making the CompiledTemplateBuilder work for you. Create a Template Library.

dannychen — Fri, 27 Jan 2006 21:00:00 GMT

This is a bit of a follow on to my last post. At the end, I made an update about how to make use of custom TreeNodes in a databound scenario. I did that example with the CSSTreeNode instead of the TemplatedTreeNode because the custom property in the templated case was an ITemplate. Trying to assign a value to that property is a great deal more difficult than a string property. And that got me thinking...

Lets start with something that seems pretty simple:

<asp:SiteMapPath ID="SiteMapPath1" runat="server">
    <NodeTemplate>
        <%# Eval("title") %>
    </NodeTemplate>
</asp:SiteMapPath> 

What if you wanted to add this control to the page dynamically? How would you write it in code? Well, adding the SiteMapPath to the page is pretty simple. But the NodeTemplate isn't so simple. What actually happens in that case is a mechanism in the framework creates a new object on the fly that implements the ITemplate interface and generates some code to populate the template. In order to do this manually, the developer would have to create his/her own ITemplate object and databinding code. Here's a simplified version of what that code might look like:

public class MyTemplate : ITemplate
{
    public void InstantiateIn(Control container)
    {
        Label l1 = new Label();
        container.Controls.Add(l1);
        l1.DataBinding += new EventHandler(l1_DataBinding);    
    }

    void l1_DataBinding(object sender, EventArgs e)
    {
        Label l1 = sender as Label;
        SiteMapNodeItem container = l1.BindingContainer as SiteMapNodeItem;
        l1.Text = container.SiteMapNode.Title;
    }
} 

public partial class TestPage : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        SiteMapPath smp = new SiteMapPath();
        smp.NodeTemplate = new MyTemplate();
        form1.Controls.Add(smp);
    }
} 

Keep in mind, this code is for a single eval statement. If you wanted to add several controls, some styles, maybe another template or two (perhaps 20 lines of markup), this could quickly become 100+ lines of code for this single control. This is especially unfortunate because this is work that the parser can do reliably and quickly.

So the question is, how can I get the parser to parse the template markup for me and yet present me with a reference to the ITemplate object instead of consuming it?

The Template Library Control

What we need is a control (with no rendering, kind of like a datasource) with a public property that is a collection of templates. Then similarly to how the page parser will populate a ListItem collection or a MenuItem collection for you, it could populate a Template collection. It'd be additionally nice to have random access to the list through a Name rather than by index. Amazingly enough, this actually works: (link to full listing at the bottom of the article):

    
    [ParseChildren(true,"Templates"), PersistChildren(false)]
    public class TemplateLibrary : Control
    {
        public TemplateLibrary()
        {
            _templates = new TemplateList();
        }
        
        private TemplateList _templates;
        [PersistenceMode(PersistenceMode.InnerProperty)]
        public TemplateList Templates
        {
            get { return _templates; }
        }

    }

    public class TemplateList : List<TemplateItem>
    {
        public TemplateItem this[string key] { ... }
    }

    public class TemplateItem : ITemplate
    {
        private string _name;
        private ITemplate _template;

        public string Name { ... }

        [PersistenceMode(PersistenceMode.InnerDefaultProperty), 
         TemplateContainer(typeof(IDataItemContainer))]        
        public ITemplate Template { ... }

        #region ITemplate Members
        public void InstantiateIn(Control container) { ... }
        #endregion
    }
} 

Here's how this might be used in markup:

<MS:TemplateLibrary  runat="server" ID="TemplateLibrary1">
    <MS:TemplateItem Name="Template1">
        <Template>Some Content</Template>
    </MS:TemplateItem>            
    <MS:TemplateItem Name="Template2">
        <Template>Some Other Content</Template>
    </MS:TemplateItem>            
</MS:TemplateLibrary> 

protected void Page_Load(object sender, EventArgs e)
{
    Menu1.StaticItemTemplate = TemplateLibrary1.Templates["Template1"];
    Menu1.DynamicItemTemplate = TemplateLibrary1.Templates["Template2"];
} 
 

As shown here, the end result is that the templates are built by the parser but exposed through a public property on the control. The control itself has no inherent rendering so it doesn't really affect the page output. Since the templates are assigned in code, some special logic could be used to choose which template should be applied where. Here are a couple more examples of things you can do that would, otherwise, have been a great deal more difficult to accomplish.

Example 1: This first example makes uses of the templated TreeNodes from the previous post. In this case, I'm choosing, dynamically, based on the data in web.sitemap, which template should be applied.

<%@ Page Language="C#" Debug="true" %>
<%@ Register Namespace="MSSamples" TagPrefix="MS" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script runat="server">
    
    protected void MyTreeView1_TreeNodeDataBound(object sender, TreeNodeEventArgs e)
    {
        if (e.Node is TemplatedTreeNode)
        {
            TemplatedTreeNode tn = e.Node as TemplatedTreeNode;
            SiteMapNode smn = e.Node.DataItem as SiteMapNode;
                        
            if( smn != null && smn["preTemplate"] != null )
                tn.PreTextTemplate = TemplateLibrary1.Templates[ smn["preTemplate"] ];
            
            if( smn != null && smn["postTemplate"] != null )
                tn.PostTextTemplate = TemplateLibrary1.Templates[ smn["postTemplate"] ];
        }
    }

</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>Untitled Page</title>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <MS:MyTreeView runat="server" ID="MyTreeView1" ExpandDepth="2" DataSourceID="SiteMapDataSource1"
                OnTreeNodeDataBound="MyTreeView1_TreeNodeDataBound">
            </MS:MyTreeView>
            <asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" />
                        
            <MS:TemplateLibrary runat="server" ID="TemplateLibrary1">
                <MS:TemplateItem Name="arrow">
                    <Template>
                        ==>                        
                    </Template>
                </MS:TemplateItem>
                <MS:TemplateItem Name="valuePath">
                    <Template>
                        ValuePath:
                        <%# DataBinder.Eval(Container.DataItem, "ValuePath") %>
                    </Template>
                </MS:TemplateItem>
            </MS:TemplateLibrary>
        </div>
    </form>
</body>
</html>

Web.SiteMap Contents:

<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
  <siteMapNode title="Home" preTemplate="arrow">
    <siteMapNode title="Products" >
      <siteMapNode title="Hardware" postTemplate="valuePath"/>
    </siteMapNode>
  </siteMapNode>    
</siteMap> 

Output:

Example 2: The key concept in this example is that the template library could be shared through a user control to every page that requires it.

Templates.ascx:

<%@ Control Language="C#" ClassName="Templates" %>
<%@ Register Namespace="MSSamples" TagPrefix="MS" %>

<script runat="server">
    public TemplateLibrary TLib
    {
        get { return TemplateLibrary1; }
    }
</script>

        <MS:TemplateLibrary  runat="server" ID="TemplateLibrary1">
            <MS:TemplateItem Name="greenTemplate">
                <Template>
                    <div style="background-color:Green"><%# Eval("Text") %></div>
                </Template>
            </MS:TemplateItem>            
            <MS:TemplateItem Name="yellowTemplate">
                <Template>
                    <div style="background-color:Yellow"><%# Eval("Text") %></div>
                </Template>
            </MS:TemplateItem>            
            <MS:TemplateItem Name="redTemplate">
                <Template>
                    <div style="background-color:Red"><%# Eval("Text") %></div>
                </Template>
            </MS:TemplateItem>            
        </MS:TemplateLibrary> 

MyPage.aspx

<%@ Page Language="C#" %>
<%@ Import Namespace="MSSamples" %>
<%@ Register Src="Templates.ascx" TagName="Templates" TagPrefix="uc1" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script runat="server">

    protected void Page_Load(object sender, EventArgs e)
    {
        foreach( TemplateItem ti in Templates1.TLib.Templates )
        {
            Menu m1 = new Menu();
            m1.Items.Add(new MenuItem("Item One"));
            m1.Items.Add(new MenuItem("Item Two"));
            m1.StaticItemTemplate = ti;
            form1.Controls.Add(m1);
        }
    }
</script>

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Untitled Page</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <uc1:Templates id="Templates1" runat="server">
        </uc1:Templates>
    </div>
    </form>
</body>
</html> 

Output:

EDIT: One subtle note that I don't really mention in the article.  A large portion of DataBinding happens through reflection.  This really lets the Templates in the "library" maintain their ability to databind even though the container and data object isn't yet known.  This is cool because if two data objects happen to have the same property name, the same template could be used for either one.  I did assume that the container would be an IDataItemContainer, and that seems to work pretty well.  

Link to C# code listing