Multiselect Dropdown in PluginSettingsTab

I’d like to add a dropdown-element to my settings-tab, where the user can select multiple options from the dropdown instead of just one. I got as far as this:

    new Setting(this.containerEl)
      .setName("Test Dropdown")
      .addDropdown((dropdown) =>
        dropdown
          .addOptions({ Foo: "Foo", Bar: "Bar", Baz: "Baz" })
          .setValue(this.plugin.settings.headings.join(", ") || "")
          .onChange((val) => {
            if (this.plugin.settings.headings.includes(val)) {
              this.plugin.settings.headings =
                this.plugin.settings.headings.filter((i) => i !== val);
            } else {
              this.plugin.settings.headings.push(val);
            }

            console.log(this.plugin.settings.headings);
            this.plugin.saveSettings();
          })
          .selectEl.setAttr("multiple", null) // This doesn't help
      );

It already sets the settings as I would expect it to. However, the selected candidates are not highlighted in the UI. Also the dropdown doesn’t show all chosen candidates (I thought this was applied via the ...join(", ")-call), but always shows the last clicked candidate.

What can I do to add this functionality? Is there a workaround that I could use?