TypeError: Cannot read property 'Symbol(Symbol.iterator)' of undefined Ln -1 Col -1

[bondib]

I'm getting (with a few of my html files):

WARNING: TypeError: Cannot read property 'Symbol(Symbol.iterator)' of undefined Ln -1 Col -1 /src/analysis/vg-selection.html

And I don't see anything special in the html template itself (e.g of /src/analysis/vg-selection.html) that should error like that:

<div class="portlet light" is-loading.bind="isLoading">
    <div class="portlet-title">
        <div class="caption">
            <span class="caption-subject">
                Selected: ${numeberOfSelectedVolumeGroups & oneTime & signal: 'VolumeSelectedChangedSignal'} VGs, ${numeberOfSelectedVolumes & oneTime & signal: 'VolumeSelectedChangedSignal'} Volumes.
            </span>
        </div>
        <div class="actions">
            <a class="btn btn-circle btn-icon-only btn-default"  click.trigger="expandAll()" title="Expand all">
                <i class="fa fa-plus-square-o" aria-hidden="true"></i>
            </a>
            <a class="btn btn-circle btn-icon-only btn-default"  click.trigger="collapseAll()" title="Collapce all">
                <i class="fa fa-minus-square-o" aria-hidden="true"></i>
            </a>
            <a class="btn btn-circle btn-icon-only btn-default fullscreen"  title=""> </a>
        </div>
    </div>
    <div class="portlet-body table-responsive">
        <table class="table table-hover table-perf">
            <thead>
                <th>
                    <input type="checkbox" title="All" click.trigger="checkAll($event)">
                </th>
                <th click.delegate="sortVgsBy('name')">
                    <hs-translate>VG / Volume</hs-translate>
                    <i if.bind="sortBy == 'name'" class="fa fa-sort-${sortDesc}" aria-hidden="true"></i>
                </th>
                <th click.delegate="sortVgsBy('comprasion')">
                    <hs-translate>Compression</hs-translate>
                    <i if.bind="sortBy == 'comprasion'" class="fa fa-sort-${sortDesc}" aria-hidden="true"></i>                        
                </th>
                <th click.delegate="sortVgsBy('avgIncomingDataCompression')">
                    <hs-translate>Avg. Incoming data compression</hs-translate>
                    <i if.bind="sortBy == 'avgIncomingDataCompression'" class="fa fa-sort-${sortDesc}" aria-hidden="true"></i>    
                </th>
                <th click.delegate="sortVgsBy('latestIncomingDataCompression')">
                    <hs-translate>Latest Incoming data compression</hs-translate>
                     <i if.bind="sortBy == 'latestIncomingDataCompression'" class="fa fa-sort-${sortDesc}" aria-hidden="true"></i>    
                </th>
                <th click.delegate="sortVgsBy('allocated')">
                    <hs-translate>Allocated Capacity</hs-translate>
                    <i if.bind="sortBy == 'allocated'" class="fa fa-sort-${sortDesc}" aria-hidden="true"></i>
                </th>
                <th click.delegate="sortVgsBy('provisioned')">
                    <hs-translate>Provisioned Capacity</hs-translate>
                    <i if.bind="sortBy == 'provisioned'" class="fa fa-sort-${sortDesc}" aria-hidden="true"></i>
                </th>
            </thead>
            <tbody>
                <template repeat.for="vg of vgs">
                    <tr>
                        <td>
                            <hs-checkbox change.delegate="vgSelected($event,vg.id)" checkedstate.bind="vg.selectionState  & oneTime & signal: 'VolumeSelectedChangedSignal'"></hs-checkbox>
                        </td>
                        <td title="${vg.name}" class="name-columns">
                            <a click.delegate="vg.collapsed = !vg.collapsed">
                                <i class.bind="vg.collapsed ? 'fa fa-angle-right' :'fa fa-angle-down'" aria-hidden="true"></i>
                                <i class.bind="vg.isSnap ? 'vg-icon-view' : 'vg-icon'" aria-hidden="true"></i>
                                <span>${vg.name}</span>
                            </a>
                        </td>
                        <td class="center-text">
                            ${vg.comprasion | numeral:'0.[0]' & oneTime & signal: 'VolumeChangedSignal'}x
                        </td>
                        <td class="center-text">
                             ${vg.avgIncomingDataCompression | numeral:'0.[0]' & oneTime & signal: 'VolumeChangedSignal'}x
                        </td>
                        <td class="center-text">
                            ${vg.latestIncomingDataCompression | numeral:'0.[0]' & oneTime & signal: 'VolumeChangedSignal'}x
                        </td>
                        <td class="center-text">${vg.allocated | numeral:'0.0b' & oneTime & signal: 'VolumeChangedSignal'}</td>
                        <td class="center-text">${vg.provisioned | numeral:'0.0b' & oneTime & signal: 'VolumeChangedSignal'}</td>
                    </tr>
                    <template if.bind="!vg.collapsed">
                        <template repeat.for="vol of vg.volumes">
                            <tr class="volume-line">
                                <td></td>
                                <td title="${vol.name}">
                                    <label>
                                        <input type="checkbox" checked.bind="vol.selected" change.delegate="triggerVolumeSelectedChanged()">
                                        <i class.bind="volume.isSnapshot ? 'volume-snap-icon' : 'volume-icon'" aria-hidden="true"></i>
                                        <span>${vol.name}</span>
                                    </label>
                                </td>
                                <td class="center-text">
                                    ${vol.comprasion | numeral:'0.[0]' & oneTime & signal: 'VolumeChangedSignal'}x
                                </td>
                                <td class="center-text">
                                    ${vol.avgIncomingDataCompression | numeral:'0.[0]' & oneTime & signal: 'VolumeChangedSignal'}x
                                </td>
                                <td class="center-text">
                                    ${vol.latestIncomingDataCompression | numeral:'0.[0]' & oneTime & signal: 'VolumeChangedSignal'}x
                                </td>
                                <td class="center-text">${vol.allocated | numeral:'0.0b'}</td>
                                <td class="center-text">${vol.provisioned | numeral:'0.0b'}</td>
                            </tr>
                        </template>
                    </template>
                </template>
            </tbody>
        </table>
        <h4 class="center-text" if.bind="showNoDataAvailable"><i class="fa fa-meh-o"></i><br> No results found </h4>
    </div>
</div>

[MeirionHughes]

hmmm, It would be helpful if you could whittle down your html until you can find something that triggers it; then post the related view-model property for it.

[bondib]

OK, so I found the issue.
It's this part from the HTML above:
<a click.delegate="vg.collapsed = !vg.collapsed">

So i agree the code isn't the best - and that this logic should have been placed in a function in the VM, and not inline as it's - but still the linter shouldn't fail on this - as linter wise - it's legit as the code works.

I do understand why it's complicated to validate - so I suggest that instead of validating this type of code (which is complex and not a good approach generally speaking) - maybe a warning should be written - that it's not recommended and that the linter can't verify this type of code...

[MeirionHughes]

Generally if something isn't supported I'll at least triage it to stop the warnings. What is the view-model property for vg and what is vg type?

[bfil]

Had the same issue, since the code seem to be failing here: https://github.com/MeirionHughes/aurelia-template-lint/blob/develop/source/rules/binding.ts#L236

..because of args is undefined, it looks like it could be easily patched. I could open a PR but I'm not sure in what way this should behave, would reporting the issue as a warning be good enough?

For now, I've monkey patched it by doing access.args || [] so that it skips the problematic parts of the templates but at least it still proceeds and checks the rest instead of just throwing an error.