XSS in soho-autocomplete

[anhallbe]

Describe the bug
Script tags that are in a soho-autocomplete search result are executed when searching for the tag. This happens with and without a custom template.

To Reproduce
Given the following component:

<div class="field">
  <label soho-label>Model: {{selected}}</label>
  <input soho-autocomplete [source]="source" filterMode="contains" [(ngModel)]="selected" placeholder="Search for <script">
</div>

@Component({
  selector: 'app-autocomplete-xss',
  templateUrl: './autocomplete-xss.component.html',
  styleUrls: ['./autocomplete-xss.component.css']
})
export class AutocompleteXssComponent {

  selected: string;
  source: SohoAutoCompleteSource = [
    'Hello',
    'World',
    '<script>alert(1)</script>xss'
  ];
}

Steps to reproduce the behavior:

1. Enter the < character in the search field
2. Script is executed here

Expected behavior
The script is not executed in Step#2

Version

• ids-enterprise-ng: v5.2.1

Platform
Tested in Chrome on Windows & Safari on MacOS.

Additional context
Repro: https://anhallbe.github.io/ids-repro/autocomplete-xss though I'm having some issues with deploying on GH Pages.

Source code here: https://github.com/anhallbe/ids-repro/tree/master/src/app/autocomplete-xss

The problem only occurs when searching for the script tag, e.g <script. It does not occur when searching for the other contents of the source. Possibly related to result highlighting?

[tmcconechy]

Did you try to reproduce this in EP by updating this example? https://github.com/infor-design/enterprise/blob/master/app/views/components/autocomplete/test-xss-security.html i was playing around with it but cant seem to reproduce this. That would make this issue easier to resolve as this should be a core EP issue I would think.

[anhallbe]

I can reproduce it in EP, though not with the same source as above. The following will cause the script to execute when searching for "<s":

index.html:

<div class="row">
        <div class="twelve columns">
            <div class="field">
                <label for="autocomplete">XSS Test Autocomplete</label>
                <input type="text" id="autocomplete" class="autocomplete">
            </div>
        </div>
    </div>
    <script src="index.js"></script>

index.js:

$("#autocomplete").autocomplete({
    source: [
        "Hello",
        `<script>window.alert('autocomplete xss')</script>XSS">&lt;script&gt;window.alert('autocomplete xss')&lt;/script&gt;XSS`,
        "World",
    ]
})

[tmcconechy]

I’m also trying the same. So far no luck but not giving up yet. I do have it reproducible in NG.

If we do need to patch an NG I guess that would be a 5.3.1 since 5.3 runs 4.18.1. But still checking on where it would be solved

[anhallbe]

I just tested with a similar source to your dropdown example in the other ticket. See edited comment above

[tmcconechy]

Where you able to get this to run in the EP sample app? i keep getting "Uncaught SyntaxError: Invalid or unexpected token"

[tmcconechy]

Got it! Working on a fix

[janahintal]

QA Passed. Will move to Done.
Tested in:
https://master-enterprise.demo.design.infor.com/components/modal/test-xss.html
https://master-enterprise.demo.design.infor.com/components/dropdown/test-xss.html
https://master-enterprise.demo.design.infor.com/components/autocomplete/test-xss-security.html