### Begin of the deletion

###End of the deletion Steps to reproduce

1. On a fresh instance (outgoing email not yet configured), go to

2. Administration > Emails and notifications > Email notifications ( /admin/settings/mail\_notifications ).

3. Observe the "Email delivery method" dropdown. It displays "SMTP".

4. Try to enter your SMTP server / port / username / password.


### What is the buggy behavior?

There are no SMTP fields on screen. The "Email delivery method" dropdown already shows Begin of the deletion

End of the deletion "smtp", but the SMTP server / port / authentication / username / password inputs are not Begin of the deletion

End of the deletion displayed, so there is nowhere to type the settings. Begin of the deletion

End of the deletion Clicking the dropdown and selecting "smtp" (the value already shown) does nothing, Begin of the deletion

End of the deletion because selecting the already-selected value does not emit a `change` event. The only Begin of the deletion

End of the deletion way to make the fields appear is the non-obvious workaround of selecting "sendmail" Begin of the deletion

End of the deletion first and then switching back to "smtp", which finally fires a `change` event and Begin of the deletion

End of the deletion reveals the fields. The fields are hidden again on every subsequent page load.

### What is the expected behavior?

Begin of the deletion <br>

End of the deletion On page load, the SMTP field group should be shown whenever the &quot;Email delivery method&quot; Begin of the deletion

End of the deletion dropdown&#x27;s current value is &quot;smtp&quot; (and the sendmail field group when it is &quot;sendmail&quot;), Begin of the deletion

End of the deletion without requiring the user to toggle the dropdown. The visible state of the conditional Begin of the deletion

End of the deletion fields should always match the currently selected delivery method, including on initial Begin of the deletion

End of the deletion render.

Begin of the deletion ###

End of the deletion ### Environment information

**Browser**

* [x] Chrome
* [ ] Firefox
* [ ] Safari
* [ ] Mobile Safari
* [ ] Other (please specify)

**Operating System**

* [ ] Windows
* [ ] Mac OS X
* [ ] Mobile iOS
* [ ] Mobile Android
* [x] Linux (please specify distro) (see below)
* [ ] Chrome OS
* [ ] Other (please specify)

**Language**

_Please specify the browser language and the language of the OpenProject user for which the bug occurred._

**\===========================================================================================**

SUGGESTED CODE FIX

**\===========================================================================================**

Evaluate the current state once when the cause element connects, so the conditional

fields render correctly on load. Factor the existing body out of &#x60;toggleDisabled&#x60; into a

shared method and call it from both &#x60;causeTargetConnected&#x60; and the change handler.

&#x60;frontend/src/stimulus/controllers/show-when-value-selected.controller.ts&#x60;:

causeTargetConnected(target: HTMLInputElement | HTMLSelectElement) {

target.addEventListener(&#x27;change&#x27;, this.boundListener);

this.applyFor(target); &nbsp;                     // &lt;-- NEW: evaluate initial state on load

}

causeTargetDisconnected(target: HTMLInputElement | HTMLSelectElement) {

target.removeEventListener(&#x27;change&#x27;, this.boundListener);

}

toggleDisabled(evt: Event) {

this.applyFor(evt.target as HTMLInputElement | HTMLSelectElement);   // unchanged behaviour

}

private applyFor(input: HTMLInputElement | HTMLSelectElement) {

const targetName = input.dataset.targetName;

this.effectTargets

.filter((el) =&gt; targetName === el.dataset.targetName)

.forEach((el) =&gt; {

const disabled = this.willDisable(el, input.value);

(el as HTMLInputElement).disabled = disabled;

if (el.dataset.setVisibility === &#x27;true&#x27;) {

toggleElementByVisibility(el, !disabled);

} else {

toggleElement(el, !disabled);

}

});

}

This preserves the existing change-driven behaviour exactly (it just calls the same logic

from &#x60;applyFor&#x60;) and additionally reconciles visibility on connect, so the SMTP/sendmail

groups always match the selected delivery method on first render.

**\===========================================================================================**

ENVIRONMENT SUMMARY

**\===========================================================================================**

Product / version : OpenProject 17.5.1, Community edition

Installation      : Packaged (DEB) install

OS                : Debian 12

Web server        : Apache/2.4.67 (Debian), HTTP (no TLS)

Affected file     : frontend/src/stimulus/controllers/show-when-value-selected.controller.ts

Affected page     : /admin/settings/mail\_notifications

Severity          : Medium — blocks configuring outgoing email through the web UI on a

fresh install; not a crash and has a non-obvious workaround.