fix(HLS): Fix display CEA-708 in HLS (#5694)

Fixes #5627

Backported to v4.3.x

lib/hls/hls_parser.js

@@ -1440,7 +1440,14 @@ shaka.hls.HlsParser = class {
     for (const tag of closedCaptionsTags) {
       goog.asserts.assert(tag.name == 'EXT-X-MEDIA',
           'Should only be called on media tags!');
-      const language = this.getLanguage_(tag);
+      const languageValue = tag.getAttributeValue('LANGUAGE');
+      let language = this.getLanguage_(tag);
+      if (!languageValue) {
+        const nameValue = tag.getAttributeValue('NAME');
+        if (nameValue) {
+          language = nameValue;
+        }
+      }
 
       // The GROUP-ID value is a quoted-string that specifies the group to which
       // the Rendition belongs.
@@ -1449,7 +1456,9 @@ shaka.hls.HlsParser = class {
       // The value of INSTREAM-ID is a quoted-string that specifies a Rendition
       // within the segments in the Media Playlist. This attribute is REQUIRED
       // if the TYPE attribute is CLOSED-CAPTIONS.
-      const instreamId = tag.getRequiredAttrValue('INSTREAM-ID');
+      // We need replace SERVICE string by our internal svc string.
+      const instreamId = tag.getRequiredAttrValue('INSTREAM-ID')
+          .replace('SERVICE', 'svc');
       if (!this.groupIdToClosedCaptionsMap_.get(groupId)) {
         this.groupIdToClosedCaptionsMap_.set(groupId, new Map());
       }