akiyamaneko opened a new pull request #30182:
URL: https://github.com/apache/spark/pull/30182
### What changes were proposed in this pull request?
In the old version of spark in the storage UI page, the sorting function is
normal, but sorting in the new version will cause the header content to be
lost, So I try to fix the bug.
### Why are the changes needed?
The header field of the table on the page is similar to the following,
**note that each th contains the span attribute**:
```html
<thead>
<tr>
....
<th width="" class="">
<span data-toggle="tooltip" title=""
data-original-title="StorageLevel displays where the persisted RDD is stored,
format of the persisted RDD (serialized or de-serialized) andreplication factor
of the persisted RDD">
Storage Level
</span>
</th>
.....
</tr>
</thead>
```
After `sorttable.js` is modified in the
[PR#26136](https://github.com/apache/spark/pull/26136), if the `th` in the
table itself contains the `span` attribute, the `span` will be deleted directly
after clicking the sort, and the original header content will be lost.
I think the following problems exist in `sorttable.js`:
1. `sortrevind.class = "sorttable_sortrevind"` in
[sorttab.js#107](https://github.com/apache/spark/blob/9d5e48ea95d1c3017a51ff69584f32a18901b2b5/core/src/main/resources/org/apache/spark/ui/static/sorttable.js#L107)
and `sortfwdind.class = "sorttable_sortfwdind"` in
[sorttab.js#125](https://github.com/apache/spark/blob/9d5e48ea95d1c3017a51ff69584f32a18901b2b5/core/src/main/resources/org/apache/spark/ui/static/sorttable.js#L125)
sorttable_xx attribute should be assigned to`className` instead `class`, as
javascript uses `rowlists[j].className.search` rather than
`rowlists[j].class.search` to determine whether the component has a sorting
flag or not.
2. `rowlists[j].className.search(/\sorttable_sortrevind\b/)` in
[sorttab.js#120](https://github.com/apache/spark/blob/9d5e48ea95d1c3017a51ff69584f32a18901b2b5/core/src/main/resources/org/apache/spark/ui/static/sorttable.js#L120)was
wrong. The original intention is to search whether `className` contains the
word `sorttable_sortrevind` , but the expression is wrong, it should be
`\bsorttable_sortrevind\b` instead of `\sorttable_sortrevind\b`
3. The if check statement in the following code snippet is wrong. **If the
`search` function does not find successfully, it will return -1, but
Boolean(-1) is actually equals true**. This statement will cause span to be
deleted even if it does not contain sorttable_sortfwdind or
sorttable_sortrevind.
```javascript
rowlists = this.parentNode.getElementsByTagName("span");
for (var j=0; j < rowlists.length; j++) {
if (rowlists[j].className.search(/\bsorttable_sortfwdind\b/)
|| rowlists[j].className.search(/\sorttable_sortrevind\b/)
) {
rowlists[j].parentNode.removeChild(rowlists[j]);
}
}
```
### Does this PR introduce _any_ user-facing change?
NO.
### How was this patch tested?
The manual test result of the ui page is as below:
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
us...@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: reviews-unsubscr...@spark.apache.org
For additional commands, e-mail: reviews-h...@spark.apache.org
