[css-animations-2] animation-trigger Name Clash Resolution

[DavMila]

The current direction of #12336 is that animations are associated with triggers via names (dashed idents). I’m filing this issue so that we can resolve on 2 questions:

1. How should name clashes between elements be resolved?
   For example:

#source1 {
 event-trigger-name: --trigger;
}
#source2 {
 event-trigger-name: --trigger;
}
#target {
 animation-trigger: --trigger;
}

Should #target get the trigger on #source1 or on #source2?
In theory we could specify that the above CSS attaches 2 triggers to #target’s animation. However, we’ve resolved in #12399 to allow only a single trigger per animation to start. As such, #target needs to pick one trigger.

Some precedents:

• The anchor position pattern: among elements with the same anchor-name, the last in tree-order is selected.
• The timeline-scope pattern: where multiple timelines have the same name within a particular scope, that name is considered to refer to an inactive timeline.

I think the timeline-scope approach is perhaps limiting so I propose we go with the anchor-name pattern. This would mean that, for example, a bunch of buttons which declare triggers of the same name, only the last one in tree order will be attached to elements declaring animation-trigger of that name. However this problem will be solved when we introduce a trigger-scope property which limits visibility of trigger names similar to anchor-scope. I can also see the timeline-scope approach being desirable so I’m completely happy to go that way too.

2. How should name clashes between timeline-trigger and event-trigger be resolved?

#source {
  event-trigger: --trigger;
  timeline-trigger: --trigger;
}
#target {
  animation: ...;
  animation-trigger: --trigger;
}

Does #target’s animation get an EventTrigger or a TimelineTrigger?

I propose timeline-trigger take precedence over event-trigger because because we can think of a TimelineTrigger as a special case of an EventTrigger which has not just a "primary" (i.e. "start") class of events (enter) but also a "secondary" (i.e. "end") class of events (exit), whereas regular EventTriggers simply have "primary" events, e.g. "click", "keypress", "mouseleave", etc, with which they associate with a specified action. So timeline-trigger should take precedence when both are present and clash on name.
Ultimately it’s a bit of an arbitrary decision but it seems like behavior that should be defined. And I think whichever way we go is fine since this is probably a weird edge case anyway.