Buttons do not visually respond in web/browser version

[shunju]

Steps to reproduce:

• Login into Mattermost using a browser (e.g. Firefox 94.0.1, but problem occurs in Edge and Chrome as well)
• Create a poll in any channel with

/poll "Can you click buttons in the browser?" "yes" "no"

• Click "yes"

Observed behavior:

• Button does not show your vote (but vote is counted and confirmed by matterpoll BOT)
• When opening the same channel in the Mattermost app (client version 5.0.0 on Windows), the button does change color

Expected behavior:

• Button changes color upon clicking to show what was voted for.

Server configuration:
Debian 10
Mattermost 5.39.0
materpoll 1.4.0 w/ "Experimental UI" enabled

[hanzei]

@shunju Can you confirm that "Experimental UI is enabled in the Matterpoll settings? Do you see any error messages in the developer console?

[shunju]

Yes, I failed to mention that: "Experimental UI" is enabled.

I am not sure what you mean by "developer console". In the "System Console" under "Reporting" and "Server Logs", I do not see any pertinent errors. However, I may be looking in the wrong place. If so, please guide me where exactly in the app or on the server I should look.

Much appreciated!

[kaakaa]

Developer console is called DevTools in FireFox, it can open by browser's right click menu > Inspect. And please check "Console" tab in DevTools which shows logs in browser. Matterpoll may write any logs in "Console". Thanks.

r.

[shunju]

Please find attached a screenshot of the console. Apparently, the plugin failed to load its JavaScript due to a mismatch of the MIME type.

[hanzei]

@shunju What is the content-type of the plugin bundle? You can find that information under Network by searching for matterpoll.

[shunju]

The content-type is text/plain; charset=utf-8. See below HAR.

{
  "log": {
    "version": "1.2",
    "creator": {
      "name": "Firefox",
      "version": "78.14.0"
    },
    "browser": {
      "name": "Firefox",
      "version": "78.14.0"
    },
    "pages": [
      {
        "startedDateTime": "2021-11-23T12:26:52.151+01:00",
        "id": "page_1",
        "title": "Mattermost",
        "pageTimings": {
          "onContentLoad": 380,
          "onLoad": 1523
        }
      }
    ],
    "entries": [
      {
        "pageref": "page_1",
        "startedDateTime": "2021-11-23T12:26:52.151+01:00",
        "request": {
          "bodySize": 0,
          "method": "GET",
          "url": "https://(hostname)/static/plugins/com.github.matterpoll.matterpoll/com.github.matterpoll.matterpoll_8d4d7b4076b9ba73_bundle.js",
          "httpVersion": "HTTP/2",
          "headers": [
            {
              "name": "Host",
              "value": "(hostname)"
            },
            {
              "name": "User-Agent",
              "value": "Mozilla/5.0 (X11; Linux x86_64; rv:78.0) Gecko/20100101 Firefox/78.0"
            },
            {
              "name": "Accept",
              "value": "*/*"
            },
            {
              "name": "Accept-Language",
              "value": "en-US,en;q=0.5"
            },
            {
              "name": "Accept-Encoding",
              "value": "gzip, deflate, br"
            },
            {
              "name": "Connection",
              "value": "keep-alive"
            },
            {
              "name": "Cookie",
              "value": (…)
            },
            {
              "name": "TE",
              "value": "Trailers"
            }
          ],
          "cookies": [
            (…)
          ],
          "queryString": [],
          "headersSize": 1117
        },
        "response": {
          "status": 403,
          "statusText": "Forbidden",
          "httpVersion": "HTTP/2",
          "headers": [
            {
              "name": "cache-control",
              "value": "max-age=31556926, public"
            },
            {
              "name": "content-type",
              "value": "text/plain; charset=utf-8"
            },
            {
              "name": "vary",
              "value": "Accept-Encoding"
            },
            {
              "name": "x-content-type-options",
              "value": "nosniff"
            },
            {
              "name": "content-length",
              "value": "14"
            },
            {
              "name": "date",
              "value": "Tue, 23 Nov 2021 11:26:52 GMT"
            },
            {
              "name": "X-Firefox-Spdy",
              "value": "h2"
            }
          ],
          "cookies": [],
          "content": {
            "mimeType": "text/plain; charset=utf-8",
            "size": 0,
            "text": ""
          },
          "redirectURL": "",
          "headersSize": 239,
          "bodySize": 239
        },
        "cache": {},
        "timings": {
          "blocked": 0,
          "dns": 0,
          "connect": 0,
          "ssl": 0,
          "send": 0,
          "wait": 31,
          "receive": 0
        },
        "time": 31,
        "_securityState": "secure",
        "serverIPAddress": "(serverIP)",
        "connection": "443"
      }
    ]
  }
}

[hanzei]

@shunju Could you please update to Mattermost 6.1, clean your browser cache and try again?

[mickmister]

Hi @shunju, I'm trying to reproduce this locally, but I'm seeing the content type to be the correct value application/javascript:

Do you have a proxy or something that could be failing to forward the headers between the browser and your server?

[shunju]

Hi @mickmister,

The issue occurs regardless of whether a proxy is used or not – both from within the network of the machine and from the outside. I just checked: I can even open a browser on the machine itself and the error occurs.

[kaakaa]

FYI: Similar issue was found mattermost/mattermost#11869. It appears to be caused by the cache, but I have not been able to confirm this as I cannot reproduce in my environment.

[devnetoy]

The "Add Option" button isn't showing even if there is --public-add-option. It appears only if you first choose some option, and after that you can add option and change vote to that option. This is not working like it should be.

Screenshot from readme:

How it works:

[kaakaa]

@devnetoy
Are you accessing Mattermost with Site URL which is configured in System Console > Environment > Web Server?

Matterpoll with experimental ui setting attempts to fetch additional information of a poll from Mattermost server using Site URL. But if you are accessing Mattermost with a URL other than Site URL, fetching will be failed due to CORS.

The following is an example of the same occurring when http://192.168.11.12:8065 is set as the Site URL and I access to Mattermost with http://localhost:8065.

[devnetoy]

@kaakaa
We are accessing our instance via configured base url.

Seems that there is some CORS errors but from whole different domain.
Also in another screenshot it says blocked mixed content. Seems that poll plugin gives out normal http urls instead of https? And we are accessing our chat server thru https.

[kaakaa]

@devnetoy Thank you for sharing these info.
Mixed content error might be the cause of your issue. But Matterpoll is using the value of SiteURL to fetch data (here and here), so it looks weird that http is used. Just to confirm, does the value set in SiteURL start with https?

And could you please open new issue for this, because your issue seems to be different from original issue.