Why doesn't button click event "bubble up visual tree" to StackPanel as MSDN article states?

The event bubbles up, until it gets handled...

Since the Button does something with your mouse clicks, it absorbs your mouse event and turns it into a ClickEvent.

If you use the PreviewMouseDown, you see that the StackPanel first receives the event before the button does.. Preview events use the Tunnel down approach..

As others have said, it's because the MouseDown event gets handled by the Button before it can be bubbled further. You can see this in Reflector, in ButtonBase.OnMouseLeftButtonDown:

protected override void OnMouseLeftButtonDown(MouseButtonEventArgs e)
{
    if (this.ClickMode != ClickMode.Hover)
    {
        e.Handled = true;
        // SNIP...
    }
    base.OnMouseLeftButtonDown(e);
}

One solution is to listen for a MouseDown event, and indicate that you don't care if the event is handled. You can do this with the AddHandler method. It has a boolean overload that lets you listen for events which are already handled.

If you do this somewhere instead of setting the MouseDown handler in XAML:

TheStackPanel.AddHandler(MouseDownEvent, new MouseButtonEventHandler(TheStackPanel_MouseDown), true);

You'll receive all MouseDown events on TheStackPanel, regardless of whether they've been handled.

In addition, if you want the stackpanel to receive the event, change the stackpanel xaml to:

<StackPanel x:Name="TheStackPanel" 
            Background="Yellow"
            Button.Click="TheStackPanel_MouseDown" />

and the event signature to:

private void TheStackPanel_MouseDown(object sender, RoutedEventArgs e)

In this case, the stackpanel will recieve the button's click event. However, clicking on the stackpanel itself won't fire any event, since it listens specifically to a button click.