Allow additional CSP hosts in <iframe> embeds

What does this MR do and why?

Allow additional CSP hosts in <iframe> embeds.

Figma requires redirecting their embeds through www.figma.com; it's why the old domain instructions required allowlisting "embed.figma.com" and "www.figma.com" separately; see our old CR at Enable content embeds in Markdown on GitLab.com (gitlab-com/gl-infra/production#20902 - closed) where we had to set both.

Permit specifying "additional CSP hosts" in provider config, and add www.figma.com to that list for Figma embeds. Note that this is only used if an instance admin enables Figma as an embed source.

Feature is wip FF'd; no active users

MR stack

MR 6/12 of Rework <iframe> embed configuration (#599713):

  1. Add `<iframe>` provider model and parser (!254943 - merged)
  2. Add `<iframe>` provider loader and base config (!254944 - merged)
  3. Convert `<iframe>` allowlist setting to provide... (!254945 - merged)
  4. Move to `<iframe>` providers (!254946 - merged)
  5. Remove dead `<iframe>` transform code (!254947 - merged)
  6. Allow additional CSP hosts in `<iframe>` embeds (!257463 - merged) ⬅️ you are here
  7. Reject sneaky dot segments in `<iframe>` URLs (!258894 - merged)
  8. Frontend `<iframe>` hardening (!254948 - merged)
  9. Render `<iframe>` embeds in Vue (!259513 - merged)
  10. Click-to-activate functionality for `<iframe>`s (!254949 - merged)
  11. Admin UI for `<iframe>` providers (!254950 - merged)
  12. Mark `<iframe>` config, loader and renderers as... (!255246)

Part of <iframe> embeds in Markdown content (#282443).

How to set up and validate locally

  1. Check out master.
  2. Enable the allow_iframes_in_markdown FF on your instance.
  3. Navigate to Admin → Settings → General → Embedded content.
  4. Check "Enable embedded content", and in the "Allowed domains" list, enter just "figma", then click "Save changes":
    image.png
    (This is odd but will be fixed as of Admin UI for `<iframe>` providers (!254950 - merged).)
  5. You may wish to restart your GDK or re-caproni run; the FF or settings check might be cached.
  6. Navigate to a work item, enter the following in a plain-text area (can be the work item description, or a new comment), and save:
    ![](https://embed.figma.com/design/nrPSsILSYjesyc5UHjYYa4){width=800}
  7. It should fail to load:
    image
  8. Check out this branch. (I didn't have to restart anything here; YMMV.)
  9. Refresh the page.
  10. It should load successfully!
    image.png

MR acceptance checklist

Evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.

Edited by Asherah Connor

Merge request reports

Loading
Loading