Strict CSP breaks ngx‑bootstrap: inline `style` attributes & `javascript:void(0)` links still present
Nobody has claimed this yet.
Assessment
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Newbie friendliness
- 43/100
- Issue type
- Bug
- Clarity
- Clearly specified
- Activity status
- Stale
- Tech stack
- angular, typescript
Research direction
Start by locating inline style creation in the positioning engine under libs/util/positioning and the host styles in Modal, Popover, and Datepicker; then inspect the Carousel, Timepicker, and Tabs templates for javascript: links. Check the CSP console errors while reviewing these entry points. Done means those widgets no longer rely on inline style attributes or javascript: anchors and work under the described strict CSP.
Written by the indexing model from the issue text.
Description
A strict Content‑Security‑Policy that omits 'unsafe-inline' (and doesn’t add style-src-attr) blocks several ngx‑bootstrap widgets:
- Positioning engine (
libs/util/positioning…) sets inlinestyle="…". - Components such as Modal, Popover, Datepicker use
host: { style: '…' }. - Templates for Carousel / Timepicker / Tabs include
href="javascript:void(0)".
Resulting console errors:
Refused to apply inline style … "style-src 'self'"
Refused to execute inline script … "script-src 'self'"
Please refactor to:
- Replace
setAttribute('style', …)with property assignments or CSS classes. - Remove
javascript:anchors (use<button>orrole="button").
This will let ngx‑bootstrap run under a modern CSP without unsafe-inline.
- Dominant language
- TypeScript
- Stars
- 5.5k
- Forks
- 1.7k
- PR merge metrics
- No merged PRs in 30d
Getting set up
This project ships no dev container, Dockerfile or contributing guide, so setting up is up to you: start from its README, and see our first-contribution guide for the general steps.
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
More from valor-software/ngx-bootstrap
-
Difficulty 1/5 Under an hour Newbie friendliness 86/100
valor-software/ngx-bootstrap#6836 ·
-
Difficulty 2/5 1-3 hours Newbie friendliness 69/100
valor-software/ngx-bootstrap#6834 ·
-
comp(pagination)
Difficulty 1/5 Under an hour Newbie friendliness 76/100
valor-software/ngx-bootstrap#6807 · 4 comments · 3 reactions ·
-
Difficulty 1/5 Under an hour Newbie friendliness 67/100
valor-software/ngx-bootstrap#6799 ·
-
Date picker and range picker still accept selection after the form control is disabledPossibly taken @Xapollon430 claimed this 2 days ago. Open
Difficulty 3/5 1-2 days Newbie friendliness 35/100
valor-software/ngx-bootstrap#6839 ·
All issues in valor-software/ngx-bootstrap
Similar issues
-
area: web
Difficulty 2/5 1-3 hours Newbie friendliness 72/100
inabagumi/shinju-date#6823 ·
Maintainers usually reply within 1 day
-
Difficulty 2/5 1-3 hours Newbie friendliness 78/100
vercel-labs/ui#540 ·
Maintainers usually reply within 1 day
-
accepted ai-dev ai-implementing
Difficulty 2/5 1-3 hours Newbie friendliness 74/100
livesport/homer#218 · 1 comment ·
Maintainers usually reply within 1 day
-
normalizePropName strips `#` characters from Figma property names instead of only the `#id` suffixOpen
Difficulty 2/5 1-3 hours Newbie friendliness 72/100
figma/code-connect#419 ·
-
Difficulty 2/5 1-3 hours Newbie friendliness 78/100