How to insert a new AST Node if absent?

[ketkarameya]

Imagine we have a JSX component expressed like

<ComponentA 
      attributeB={b} 
/>

How to write a Piranha rule such that it will add attributeA = {a} if attributeA is not present in the component?

Expected code:

<ComponentA 
  attributeA = {a}
  attributeB={b} 
/>

Question Credit - @gregintuitaio

[ketkarameya]

The idea would be to match some attribute (which is not attributeA) inside ComponentA that does not contain a attributeA. This can be achieved by using rules.constraints.

[[rules]]
name= "update_componentA"
query = """(
(jsx_attribute (property_identifier) @name ) @attribute
(#not-eq @name "attributeA")
)"""
replace_node = "attribute"
replace = """
attributeA = {a}
@attribute
"""
[[rules.constraints]]
matcher= """(
(jsx_self_closing_element name: (_) @elem_name) @enclosing_jsx_elem
(#eq? @elem_name "ComponentA")
)
"""
queries = ["""(
(jsx_attribute (property_identifier)@p ) @j
(#eq? @p "attributeA")
)"""]

[ketkarameya]

I think this also calls out that - "we should support insert child" as a first class citizen in our "DSL". Like we have to do these rules.constraints shenanigans because we express everything(insertChild, updateNode, replaceChild and deleteChild) as an update operation .
I think we should support all these 4 kinds of edit operations .
@lazaroclapp what do u think ?

[gregintuitaio]

I tried to add it actually over our fork, but there is an architectural problem with node replacement - if we e.g insert a child and then re-execute the same rule to find next occurrences of the match, we will run into an infinite loop, as no nodes were actually replaced. I guess the search should be based on ranges.

[ketkarameya]

I know what you are saying. Hence I have the constraint in the above rule. I have some ideas, I ll think about it .

[lazaroclapp]

The idea being that you need to constrain on "element that matches but doesn't already have the subnode", right?

I do agree that merely from an user experience perspective, having insert and delete as operations, in addition to update is valuable (not sure why replaceChild and updateNode need to be two different operations, though, that does seem like a case where one does logically contain the other...). Insertion and deletion are technically updates but, assuming I understand things correctly, they are very awkward to express as such.

[ketkarameya]

Yes - element that matches but doesn't already have the subnode
I agree, Insert and Delete will make user experience more pleasant.

Anyhoo, the difference between replaceChild and update (in my mind):

update:
Match a pattern structurally and replace it
replaceChild
Match a pattern structurally and replace it's i^th child
This will make it easier to write rules update i^th argument of a call site. Which otherwise is a bit awkward.
It is awkward because I have to wild card match all i -1 arguments that appear at the call site in order to match the i^th argument.
This can get hard to use when we want to update like the 5th argument of a method callsite.

[ketkarameya]

Yes - element that matches but doesn't already have the subnode

I agree, Insert and Delete will make user experience more pleasant.

Anyhoo, the difference between replaceChild and update (in my mind):

update:

Match a pattern structurally and replace it

replaceChild

Match a pattern structurally and replace it's i^th child

This will make it easier to write rules update i^th argument of a call site. Which otherwise is a bit awkward.

It is awkward because I have to wild card match all i -1 arguments that appear at the call site in order to match the i^th argument.

This can get hard to use when we want to update like the 5th argument of a method callsite.

Thinking about it a bit more I think we should call it insertChild and not just insert

[ketkarameya]

@gregintuitaio did u try the rule i suggested?

[gregintuitaio]

@ketkarameya I will try this rule tomorrow, I have created a task for myself :)