[uf-dev] Embedded compound microformat edge case

[Toby A Inkster]

Firstly to clarify, I use the term "nested" to cover the case where a  
microformat root element is contained within another microformat root  
element in DOM terms. e.g.

	<div class="vcard">
	  <p class="vcard"></p>
	</div>

I use the term "embedded" to refer to a subset of these - where the  
nesting has a deliberate and established meaning. e.g.

	<div class="vcard">
	  <p class="agent vcard"></p>
	</div>

or

	<div class="vevent">
	  <p class="attendee vcard"></p>
	</div>

Cognition has, since its first released version handle nested  
microformats fairly well. However, with embedded microformats it's  
had a major limitation, which I'm fixing for the next version. The  
limitation is that while this works fine:

	<div class="vcard">
	  <p class="agent vcard"></p>
	</div>

the following will not:

	<div class="vcard">
	  <div class="agent">
	    <p class="vcard"></p>
	  </div>
	</div>

It would be parsed as two completely separate hCards, of which the  
outer hCard would have an agent which is a simple string. As I said,  
I'm solving that for the next release. But I've come across a parsing  
edge case:

	<div class="vcard" id="x1">
	  <div class="agent">
	    <p class="vcard" id="x2"></p>
	    <p class="vcard" id="x3"></p>
	  </div>
	</div>

Should #x2 and #x3 both be treated as agents of #x1, or should #x2 be  
treated as an agent and #x3 be treated as a completely separate  
(nested) hCard? Or perhaps its *too* invalid and neither #x2 nor #x3  
should be treated as agents.

If both #x2 and #x3 are treated as agents, then what about this even  
stranger case which is differently nested, but semantically similar:

	<div class="vcard" id="x1">
	  <div class="agent">
	    <div class="vcard" id="x2">
	      <p class="vcard" id="x3"></p>
	    </div>
	  </div>
	</div>

Right now I'm using the tactic that within

	<div class="vcard" id="x1">
	  <div class="agent">
	    <p class="vcard" id="x2"></p>
	    <p class="vcard" id="x3"></p>
	  </div>
	</div>

Only #x2 is the agent of #x1. #x3 is treated as an entirely separate  
hCard. If people want #x1 to have two agents, they can write:

	<div class="vcard" id="x1">
	  <div class="agent">
	    <p class="vcard" id="x2"></p>
	  </div>
	  <div class="agent">
	    <p class="vcard" id="x3"></p>
	  </div>
	</div>

or better yet:

	<div class="vcard" id="x1">
	  <p class="agent vcard" id="x2"></p>
	  <p class="agent vcard" id="x3"></p>
	</div>

What do other people think?

PS: For simplification, I'm leaving out properties like "fn", but  
assume that they are present.

-- 
Toby A Inkster
<mailto:mail at tobyinkster.co.uk>
<http://tobyinkster.co.uk>