Fix videos not pausing when collapsing containing comment (honestblee…

…ps#4777)

`Thing#isContentVisible` adds the additional check that the comment itself is not collapsed.

Relevant issue: https://www.reddit.com/r/Enhancement/comments/8kgszp/videos_in_comments_keeps_playing_after_i_close/
Tested in browser: Chrome 66

lib/modules/showImages.js

@@ -907,7 +907,7 @@ export function getLinkExpando(link: HTMLAnchorElement): ?Expando {
 
 function shouldLinkBeDeferred(element) {
  const thing = Thing.from(element);
- return thing && !thing.isVisible() && // No need to complete building non-visible links
+ return thing && !thing.isContentVisible() && // No need to complete building non-visible links
  // Unless they are hidden because because of the expando filter
  !(thing.filter && thing.filter.case.hasType('hasExpando'));
 }
@@ -1019,7 +1019,7 @@ async function completeExpando(expando, thing, mediaInfo) {
  $([thing, ...thing.getParents()].map(e => e.entry))
  .find('.tagline > .expand, > .buttons .toggleChildren')
  .click(() => {
- if (thing.isVisible()) {
+ if (thing.isContentVisible()) {
  if (wasOpen && expando.media) expando.expand();
  } else {
  wasOpen = expando.open;

lib/utils/Thing.js

@@ -545,7 +545,10 @@ export class Thing {
 
  isFiltered(): boolean {
  return !document.body.classList.contains('res-filters-disabled') &&
- this.element.classList.contains('RESFiltered');
+ (
+ this.element.classList.contains('RESFiltered') &&
+ !this.element.classList.contains('res-thing-has-visible-child')
+ );
  }
 
  isCollapsed(): boolean {
@@ -561,11 +564,15 @@ export class Thing {
 
  isVisible(): boolean {
  return (
- !(this.isFiltered() && !this.element.classList.contains('res-thing-has-visible-child')) &&
+ !this.isFiltered() &&
  !this.isInCollapsed()
  );
  }
 
+ isContentVisible(): boolean {
+ return this.isVisible() && !this.isCollapsed();
+ }
+
  isSelected() {
  return this.element.classList.contains('res-selected');
  }