fix: fix logging in and out with a refresh (#824)
* fix: fix logging in and out with a refresh fixes #805 * simplify code * make test less flaky * fix dumb mistake
This commit is contained in:
		
							parent
							
								
									14a618f374
								
							
						
					
					
						commit
						bf9ba22c35
					
				
					 6 changed files with 51 additions and 5 deletions
				
			
		| 
						 | 
				
			
			@ -6,6 +6,7 @@
 | 
			
		|||
import { testHasLocalStorageOnce } from './src/routes/_utils/testStorage'
 | 
			
		||||
import { switchToTheme } from './src/routes/_utils/themeEngine'
 | 
			
		||||
import { basename } from './src/routes/_api/utils'
 | 
			
		||||
import { onUserIsLoggedOut } from './src/routes/_actions/onUserIsLoggedOut'
 | 
			
		||||
 | 
			
		||||
window.__themeColors = process.env.THEME_COLORS
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			@ -35,9 +36,7 @@ if (currentInstance && localStorage.store_instanceThemes) {
 | 
			
		|||
 | 
			
		||||
if (!hasLocalStorage || !currentInstance) {
 | 
			
		||||
  // if not logged in, show all these 'hidden-from-ssr' elements
 | 
			
		||||
  let style = document.createElement('style')
 | 
			
		||||
  style.textContent = '.hidden-from-ssr { opacity: 1 !important; }'
 | 
			
		||||
  document.head.appendChild(style)
 | 
			
		||||
  onUserIsLoggedOut()
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
if (hasLocalStorage && localStorage.store_disableCustomScrollbars === 'true') {
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
							
								
								
									
										11
									
								
								src/routes/_actions/onUserIsLoggedOut.js
									
										
									
									
									
										Normal file
									
								
							
							
						
						
									
										11
									
								
								src/routes/_actions/onUserIsLoggedOut.js
									
										
									
									
									
										Normal file
									
								
							| 
						 | 
				
			
			@ -0,0 +1,11 @@
 | 
			
		|||
// When the user is logged out, we need to be sure to re-show all the "hidden from SSR" styles
 | 
			
		||||
// so that we don't get a blank page.
 | 
			
		||||
export function onUserIsLoggedOut () {
 | 
			
		||||
  if (document.getElementById('hiddenFromSsrStyle')) {
 | 
			
		||||
    return
 | 
			
		||||
  }
 | 
			
		||||
  let style = document.createElement('style')
 | 
			
		||||
  style.setAttribute('id', 'hiddenFromSsrStyle')
 | 
			
		||||
  style.textContent = '.hidden-from-ssr { opacity: 1 !important; }'
 | 
			
		||||
  document.head.appendChild(style)
 | 
			
		||||
}
 | 
			
		||||
							
								
								
									
										12
									
								
								src/routes/_store/observers/logOutObservers.js
									
										
									
									
									
										Normal file
									
								
							
							
						
						
									
										12
									
								
								src/routes/_store/observers/logOutObservers.js
									
										
									
									
									
										Normal file
									
								
							| 
						 | 
				
			
			@ -0,0 +1,12 @@
 | 
			
		|||
import { onUserIsLoggedOut } from '../../_actions/onUserIsLoggedOut'
 | 
			
		||||
 | 
			
		||||
export function logOutObservers (store) {
 | 
			
		||||
  if (!process.browser) {
 | 
			
		||||
    return
 | 
			
		||||
  }
 | 
			
		||||
  store.observe('isUserLoggedIn', isUserLoggedIn => {
 | 
			
		||||
    if (!isUserLoggedIn) {
 | 
			
		||||
      onUserIsLoggedOut()
 | 
			
		||||
    }
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
| 
						 | 
				
			
			@ -3,11 +3,13 @@ import { navObservers } from './navObservers'
 | 
			
		|||
import { pageVisibilityObservers } from './pageVisibilityObservers'
 | 
			
		||||
import { resizeObservers } from './resizeObservers'
 | 
			
		||||
import { setupLoggedInObservers } from './setupLoggedInObservers'
 | 
			
		||||
import { logOutObservers } from './logOutObservers'
 | 
			
		||||
 | 
			
		||||
export function observers (store) {
 | 
			
		||||
  onlineObservers(store)
 | 
			
		||||
  navObservers(store)
 | 
			
		||||
  pageVisibilityObservers(store)
 | 
			
		||||
  resizeObservers(store)
 | 
			
		||||
  logOutObservers(store)
 | 
			
		||||
  setupLoggedInObservers(store)
 | 
			
		||||
}
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -48,7 +48,7 @@ html{scrollbar-face-color:var(--scrollbar-face-color);scrollbar-track-color:var(
 | 
			
		|||
</head>
 | 
			
		||||
<body>
 | 
			
		||||
  <!-- auto-generated w/ build-inline-script.js -->
 | 
			
		||||
  <!-- insert inline script here --><script>!function(){"use strict";let e=document.getElementById("theThemeColor"),t=document.getElementById("theOfflineStyle");function o(){return document.head.querySelector('link[rel=stylesheet][href^="/theme-"]')}window.__themeColors={default:"royalblue",scarlet:"#e04e41",seafoam:"#177380",hotpants:"hotpink",oaken:"saddlebrown",majesty:"blueviolet",gecko:"#4ab92f",ozark:"#5263af",cobalt:"#08439b",sorcery:"#ae91e8",punk:"#e04e41",riot:"hotpink",hacker:"#4ab92f",pitchblack:"#000"};const n=e=>void 0===e||"undefined"===e?void 0:JSON.parse(e),r=(()=>{try{if(localStorage.setItem("__test__","__test__"),!localStorage.length||"__test__"!==localStorage.getItem("__test__"))return!1;localStorage.removeItem("__test__")}catch(e){return!1}return!0})(),a=r&&n(localStorage.store_currentInstance);if(a){let e=document.createElement("link");e.setAttribute("rel","prefetch"),e.setAttribute("href",`${l=a,function(e){return e.startsWith("localhost:")||e.startsWith("127.0.0.1:")}(l)?`http://${l}`:`https://${l}`}/api/v1/instance`),e.setAttribute("crossorigin","anonymous"),document.head.appendChild(e)}var l;if(a&&localStorage.store_instanceThemes){let r=n(localStorage.store_instanceThemes)[n(localStorage.store_currentInstance)];r&&"default"!==r&&function(n){let r=window.__themeColors[n];e.content=r||window.__themeColors.default,"default"!==n?function(e){let n=o(),r=document.createElement("link");r.rel="stylesheet",r.href=e,r.addEventListener("load",function e(){r.removeEventListener("load",e),n&&document.head.removeChild(n)}),document.head.insertBefore(r,t)}(`/theme-${n}.css`):function(){let e=o();e&&document.head.removeChild(e)}()}(r)}if(!r||!a){let e=document.createElement("style");e.textContent=".hidden-from-ssr { opacity: 1 !important; }",document.head.appendChild(e)}if(r&&"true"===localStorage.store_disableCustomScrollbars){document.getElementById("theScrollbarStyle").setAttribute("media","only x")}/mac/i.test(navigator.platform)&&document.documentElement.style.setProperty("--scrollbar-border-radius","50px"),/iP(?:hone|ad|od)/.test(navigator.userAgent)&&document.head.removeChild(document.getElementById("theManifest"))}();
 | 
			
		||||
  <!-- insert inline script here --><script>!function(){"use strict";let e=document.getElementById("theThemeColor"),t=document.getElementById("theOfflineStyle");function o(){return document.head.querySelector('link[rel=stylesheet][href^="/theme-"]')}window.__themeColors={default:"royalblue",scarlet:"#e04e41",seafoam:"#177380",hotpants:"hotpink",oaken:"saddlebrown",majesty:"blueviolet",gecko:"#4ab92f",ozark:"#5263af",cobalt:"#08439b",sorcery:"#ae91e8",punk:"#e04e41",riot:"hotpink",hacker:"#4ab92f",pitchblack:"#000"};const n=e=>void 0===e||"undefined"===e?void 0:JSON.parse(e),r=(()=>{try{if(localStorage.setItem("__test__","__test__"),!localStorage.length||"__test__"!==localStorage.getItem("__test__"))return!1;localStorage.removeItem("__test__")}catch(e){return!1}return!0})(),l=r&&n(localStorage.store_currentInstance);if(l){let e=document.createElement("link");e.setAttribute("rel","prefetch"),e.setAttribute("href",`${a=l,function(e){return e.startsWith("localhost:")||e.startsWith("127.0.0.1:")}(a)?`http://${a}`:`https://${a}`}/api/v1/instance`),e.setAttribute("crossorigin","anonymous"),document.head.appendChild(e)}var a;if(l&&localStorage.store_instanceThemes){let r=n(localStorage.store_instanceThemes)[n(localStorage.store_currentInstance)];r&&"default"!==r&&function(n){let r=window.__themeColors[n];e.content=r||window.__themeColors.default,"default"!==n?function(e){let n=o(),r=document.createElement("link");r.rel="stylesheet",r.href=e,r.addEventListener("load",function e(){r.removeEventListener("load",e),n&&document.head.removeChild(n)}),document.head.insertBefore(r,t)}(`/theme-${n}.css`):function(){let e=o();e&&document.head.removeChild(e)}()}(r)}if(r&&l||function(){if(document.getElementById("hiddenFromSsrStyle"))return;let e=document.createElement("style");e.setAttribute("id","hiddenFromSsrStyle"),e.textContent=".hidden-from-ssr { opacity: 1 !important; }",document.head.appendChild(e)}(),r&&"true"===localStorage.store_disableCustomScrollbars){document.getElementById("theScrollbarStyle").setAttribute("media","only x")}/mac/i.test(navigator.platform)&&document.documentElement.style.setProperty("--scrollbar-border-radius","50px"),/iP(?:hone|ad|od)/.test(navigator.userAgent)&&document.head.removeChild(document.getElementById("theManifest"))}();
 | 
			
		||||
 | 
			
		||||
//# sourceMappingURL=/inline-script.js.map</script><!-- end insert inline script here -->
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -4,7 +4,7 @@ import {
 | 
			
		|||
  authorizeInput,
 | 
			
		||||
  emailInput,
 | 
			
		||||
  formError,
 | 
			
		||||
  getFirstVisibleStatus, getOpacity,
 | 
			
		||||
  getFirstVisibleStatus, getNthStatus, getOpacity,
 | 
			
		||||
  getUrl,
 | 
			
		||||
  homeNavButton,
 | 
			
		||||
  instanceInput,
 | 
			
		||||
| 
						 | 
				
			
			@ -14,6 +14,7 @@ import {
 | 
			
		|||
  settingsButton,
 | 
			
		||||
  sleep
 | 
			
		||||
} from '../utils'
 | 
			
		||||
import { loginAsFoobar } from '../roles'
 | 
			
		||||
 | 
			
		||||
fixture`002-login-spec.js`
 | 
			
		||||
  .page`http://localhost:4002`
 | 
			
		||||
| 
						 | 
				
			
			@ -72,3 +73,24 @@ test('Logs in and logs out of localhost:3000', async t => {
 | 
			
		|||
  await t
 | 
			
		||||
    .expect(getOpacity('.hidden-from-ssr')()).eql('1')
 | 
			
		||||
})
 | 
			
		||||
 | 
			
		||||
test('Logs in, refreshes, then logs out', async t => {
 | 
			
		||||
  await loginAsFoobar(t)
 | 
			
		||||
  await t
 | 
			
		||||
    .hover(getNthStatus(0))
 | 
			
		||||
  await reload()
 | 
			
		||||
  await t
 | 
			
		||||
    .hover(getNthStatus(0))
 | 
			
		||||
    .click(settingsButton)
 | 
			
		||||
    .click($('a').withText('Instances'))
 | 
			
		||||
    .click($('a').withText('localhost:3000'))
 | 
			
		||||
    .expect(getUrl()).contains('/settings/instances/localhost:3000')
 | 
			
		||||
    .expect($('.instance-name-h1').innerText).eql('localhost:3000')
 | 
			
		||||
    .expect($('.acct-handle').innerText).eql('@foobar')
 | 
			
		||||
    .expect($('.acct-display-name').innerText).eql('foobar')
 | 
			
		||||
    .click($('button').withText('Log out'))
 | 
			
		||||
    .click($('.modal-dialog button').withText('OK'))
 | 
			
		||||
    .expect($('.main-content').innerText).contains("You're not logged in to any instances")
 | 
			
		||||
    .click(homeNavButton)
 | 
			
		||||
    .expect(getOpacity('.hidden-from-ssr')()).eql('1')
 | 
			
		||||
})
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
	Add table
		
		Reference in a new issue