intellij-ideastructural-search

How to refactor Bootstrap 4 radiobuttons to Bootstrap 5 uinsg Intellij's Structural Replace


I am trying to update some Java Server Pages/Spring Webflow views from Twitter Bootstrap 4 to Bootstrap 5.

I have lots of radiobuttons and the requisite HTML boilerplate has changed quite a bit from v4 to v5. This seems like a good use-case for IntelliJ's "Structural Replace" but I can't get it to work.

Here is what I am trying:

enter image description here

I just end up with:

enter image description here

I have tried adding filters to the variables ie:

enter image description here

And I have tried changing the "search target" (to label [for example])...

None of these work.

I find Jetbrains' (normally good) doco woeful for this feature.

[edit...example code]

   <div class="row mt-2">
        <div class="col-4">
            <div class="form-check">
                <label class="custom-control custom-radio">
                    <form:radiobutton path="type" value="wdpp" cssClass="custom-control-input"/>
                    <span class="custom-control-indicator"></span>
                    <span class="custom-control-description">Wires: Pole to Pole</span>
                </label>
            </div>
            <div class="form-check">
                <label class="custom-control custom-radio">
                    <form:radiobutton path="type" value="wdpb" cssClass="custom-control-input"/>
                    <span class="custom-control-indicator"></span>
                    <span class="custom-control-description">Wires: Pole to Building</span>
                </label>
            </div>
            <div class="form-check">
                <label class="custom-control custom-radio">
                    <form:radiobutton path="type" value="transformer" cssClass="custom-control-input"/>
                    <span class="custom-control-indicator"></span>
                    <span class="custom-control-description">Transformer</span>
                </label>
            </div>
            <div class="form-check">
                <label class="custom-control custom-radio">
                    <form:radiobutton path="type" value="meterBox" cssClass="custom-control-input"/>
                    <span class="custom-control-indicator"></span>
                    <span class="custom-control-description">Meter Box</span>
                </label>
            </div>
            <div class="form-check">
                <label class="custom-control custom-radio">
                    <form:radiobutton path="type" value="pole" cssClass="custom-control-input"/>
                    <span class="custom-control-indicator"></span>
                    <span class="custom-control-description">Pole</span>
                </label>
            </div>
            [...more radios elided...]
        </div>
    </div>

[edit...a different UI appears sometimes]

Actually, I think that this UI always appears and is then quickly overlayed with the earlier one (the one with the "Find Options..." link)

[wondering about taking this to Jetbrains bug-tracker...]

enter image description here

And the template is:

<replaceConfiguration name="Unnamed" text="&lt;label class=&quot;custom-control custom-radio&quot;&gt;&#10;    &lt;form:radiobutton path=&quot;$path$&quot; value=&quot;$value$&quot; cssClass=&quot;custom-control-input&quot;/&gt;&#10;    &lt;span class=&quot;custom-control-indicator&quot;&gt;&lt;/span&gt;&#10;    &lt;span class=&quot;custom-control-description&quot;&gt;$label$&lt;/span&gt;&#10;&lt;/label&gt;" recursive="false" type="XML" dialect="HTML" search_injected="false" reformatAccordingToStyle="false" shortenFQN="false" replacement="&lt;form:radiobutton id=&quot;$path$-$value$&quot; path=&quot;$path$&quot; value=&quot;$value$&quot; cssClass=&quot;form-check-input&quot;/&gt;&#10;&lt;label class=&quot;form-check-label&quot; for=&quot;$path$-$value$&quot;&gt;$label$&lt;/label&gt;">
  <constraint name="__context__" within="" contains="" />
  <constraint name="path" within="" contains="" />
  <constraint name="value" within="" contains="" />
  <constraint name="label" within="" contains="" />
</replaceConfiguration>

Any thoughts/suggestions/pointers gratefully received.


Solution

  • It appears you are running into a bug, where it is impossible to match JSP tags inside HTML tags. Maybe you can use the following 2-step workaround. First replace the JSP tag with a fake HTML tag:

    <replaceConfiguration name="Unnamed" text="&lt;form:radiobutton path=&quot;$type$&quot; value=&quot;$transformer$&quot; cssClass=&quot;custom-control-input&quot;/&gt;" recursive="false" type="Qt UI file" dialect="JSP" reformatAccordingToStyle="false" shortenFQN="false" replacement="&lt;form-radiobutton path=&quot;$type$&quot; value=&quot;$transformer$&quot; cssClass=&quot;custom-control-input&quot;/&gt;">
      <constraint name="__context__" within="" contains="" />
      <constraint name="type" within="" contains="" />
      <constraint name="transformer" within="" contains="" />
    </replaceConfiguration>
    

    And then perform an HTML replacement with the new construct:

    <replaceConfiguration name="Unnamed" text="&lt;label class=&quot;custom-control custom-radio&quot;&gt;&#10;    &lt;form-radiobutton path=&quot;$path$&quot; value=&quot;$value$&quot; cssClass=&quot;custom-control-input&quot;/&gt;&#10;    &lt;span class=&quot;custom-control-indicator&quot;&gt;&lt;/span&gt;&#10;    &lt;span class=&quot;custom-control-description&quot;&gt;$label$&lt;/span&gt;&#10;&lt;/label&gt;" recursive="false" type="HTML" reformatAccordingToStyle="false" shortenFQN="false" replacement="&lt;form:radiobutton id=&quot;$path$-$value$&quot; path=&quot;$path$&quot; value=&quot;$value$&quot; cssClass=&quot;form-check-input&quot;/&gt;&#10;&lt;label class=&quot;form-check-label&quot; for=&quot;$path$-$value$&quot;&gt;$label$&lt;/label&gt;">
      <constraint name="__context__" within="" contains="" />
      <constraint name="path" within="" contains="" />
      <constraint name="value" within="" contains="" />
      <constraint name="label" within="" contains="" />
    </replaceConfiguration>