Mastodon
/
Whalebird-desktop-client-mac-linux-windows
mirror of https://github.com/h3poteto/whalebird-desktop
1
0
Fork 0
Code Issues Releases Wiki Activity

Merge pull request #1135 from h3poteto/iss-901 

refs #901 Use ipc, shell and clipboard from preload.js
This commit is contained in:
AkiraFukushima 2019-11-20 23:44:38 +09:00 committed by GitHub
parent a6b0369fae 1627472682
commit 21f9d90443
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
17 changed files with 232 additions and 199 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
package-lock.json generated
View File

@ -6385,7 +6385,7 @@
"dependencies": {
"resolve": {
"version": "1.1.7",
"resolved": "https://registry.npmjs.org/resolve/-/resolve-1.1.7.tgz",
"resolved": "http://registry.npmjs.org/resolve/-/resolve-1.1.7.tgz",
"integrity": "sha1-IDEU2CrSxe2ejgQRs5ModeiJ6Xs=",
"dev": true
}
@ -9448,18 +9448,18 @@
"integrity": "sha512-v+Af5W5z99ehhaLOfE9eTSXUwjzh2wFlQjz51dvkZ6ZIrET6OB/zAZPvsuwT6tm3t5x+M1r+Ed3U3xtPZYAyuQ=="
},
"electron-mock-ipc": {
"version": "0.1.3",
"resolved": "https://registry.npmjs.org/electron-mock-ipc/-/electron-mock-ipc-0.1.3.tgz",
"integrity": "sha512-+x5v+hmZZYUi8SMJNBtcq1o2p3aUJfT3aJCEKIoajSa/6rV9EdmFOd/rHLVEH85GSlWQCf+i1yV4r4bDnfEXHw==",
"version": "0.2.0",
"resolved": "https://registry.npmjs.org/electron-mock-ipc/-/electron-mock-ipc-0.2.0.tgz",
"integrity": "sha512-oEW4kS0W5ioQi5XprKXkBbD1zRINZk6AkGXsZD/mhgXaqTZuA0Qtsw1QoMWxykqnURVRl9plpmbHIvkYedsvNQ==",
"dev": true,
"requires": {
"typescript": "^3.5.2"
},
"dependencies": {
"typescript": {
"version": "3.5.2",
"resolved": "https://registry.npmjs.org/typescript/-/typescript-3.5.2.tgz",
"integrity": "sha512-7KxJovlYhTX5RaRbUdkAXN1KUZ8PwWlTzQdHV6xNqvuFOs7+WBo10TQUqT19Q/Jz2hk5v9TQDIhyLhhJY4p5AA==",
"version": "3.7.2",
"resolved": "https://registry.npmjs.org/typescript/-/typescript-3.7.2.tgz",
"integrity": "sha512-ml7V7JfiN2Xwvcer+XAf2csGO1bPBdRbFCkYBczNZggrBZ9c7G3riSUeJmqEU5uOtXNPMhE3n+R4FA/3YOAWOQ==",
"dev": true
}
}
@ -16507,7 +16507,7 @@
},
"readable-stream": {
"version": "2.3.6",
"resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz",
"resolved": "http://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz",
"integrity": "sha512-tQtKA9WIAhBF3+VLAseyMqZeBjW0AHJoxOtYqSUZNJxauErmLbVm2FW1y+J/YA9dUrAC39ITejlZWhVIwawkKw==",
"dev": true,
"requires": {
@ -16522,7 +16522,7 @@
},
"string_decoder": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
"resolved": "http://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
"integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
"dev": true,
"requires": {

2
package.json
View File

@ -248,7 +248,7 @@
"electron-builder": "^21.2.0",
"electron-debug": "^3.0.1",
"electron-devtools-installer": "^2.2.4",
"electron-mock-ipc": "^0.1.3",
"electron-mock-ipc": "^0.2.0",
"electron-packager": "^14.0.5",
"eslint": "^5.16.0",
"eslint-config-prettier": "^4.1.0",

5
spec/mock/electron.ts
View File

@ -1,7 +1,8 @@
import createIPCMock from 'electron-mock-ipc'
import { IpcRenderer, IpcMain } from 'electron'
const mocked = createIPCMock()
const ipcMain = mocked.ipcMain
const ipcRenderer = mocked.ipcRenderer
const ipcMain = mocked.ipcMain as IpcMain
const ipcRenderer = mocked.ipcRenderer as IpcRenderer
export { ipcMain, ipcRenderer }

7
spec/renderer/integration/store/App.spec.ts
View File

@ -1,6 +1,6 @@
import { createLocalVue } from '@vue/test-utils'
import Vuex from 'vuex'
import { ipcMain } from '~/spec/mock/electron'
import { ipcMain, ipcRenderer } from '~/spec/mock/electron'
import App from '@/store/App'
import DisplayStyle from '~/src/constants/displayStyle'
import { LightTheme, DarkTheme } from '~/src/constants/themeColor'
@ -8,6 +8,7 @@ import Theme from '~/src/constants/theme'
import TimeFormat from '~/src/constants/timeFormat'
import Language from '~/src/constants/language'
import DefaultFonts from '@/utils/fonts'
import { MyWindow } from '~/src/types/global'
const state = () => {
return {
@ -43,6 +44,7 @@ describe('App', () => {
let localVue
beforeEach(() => {
;(<MyWindow>window).ipcRenderer = ipcRenderer
localVue = createLocalVue()
localVue.use(Vuex)
store = new Vuex.Store({
@ -58,8 +60,7 @@ describe('App', () => {
ipcMain.once('get-preferences', (event: any, _) => {
event.sender.send('error-get-preferences', new Error())
})
await store.dispatch('App/loadPreferences')
.catch((err) => {
await store.dispatch('App/loadPreferences').catch(err => {
expect(err instanceof Error).toEqual(true)
expect(store.state.App.theme).toEqual(LightTheme)
})

4
src/main/index.ts
View File

@ -255,7 +255,9 @@ async function createWindow() {
webPreferences: {
// It is required to use ipcRenderer in renderer process.
// But it is not secure, so if you want to disable this option, please use preload script.
nodeIntegration: true
nodeIntegration: true,
contextIsolation: false,
preload: path.resolve(__dirname, './preload.js')
}
}
const config: Config = {

5
src/main/preload.js Normal file
View File

@ -0,0 +1,5 @@
const electron = require('electron')
global.ipcRenderer = electron.ipcRenderer
global.shell = electron.shell
global.clipboard = electron.clipboard
global.process = process

22
src/renderer/components/TimelineSpace/Contents/SideBar/AccountProfile.vue
View File

@ -1,11 +1,13 @@
<template>
<div id="account_profile"
<div
id="account_profile"
v-loading="loading"
:element-loading-text="$t('message.loading')"
element-loading-spinner="el-icon-loading"
element-loading-background="rgba(0, 0, 0, 0.8)"
role="article"
aria-label="account profile">
aria-label="account profile"
>
<div class="header-background" v-bind:style="{ backgroundImage: 'url(' + account.header + ')' }">
<div class="header">
<div class="follow-follower" v-if="relationship !== null && relationship !== '' && !isOwnProfile">
@ -63,9 +65,7 @@
<div class="username">
<bdi v-html="username(account)"></bdi>
</div>
<div class="account">
@{{ account.acct }}
</div>
<div class="account">@{{ account.acct }}</div>
<div class="note" v-html="note(account)" @click.capture.prevent="noteClick"></div>
</div>
</div>
@ -74,8 +74,7 @@
<dt>
{{ data.name }}
</dt>
<dd v-html="data.value" @click.capture.prevent="metadataClick">
</dd>
<dd v-html="data.value" @click.capture.prevent="metadataClick"></dd>
</dl>
</div>
<el-row class="basic-info">
@ -108,7 +107,6 @@
<script>
import { mapState, mapGetters } from 'vuex'
import { shell } from 'electron'
import { findLink } from '~/src/renderer/utils/tootParser'
import emojify from '~/src/renderer/utils/emojify'
import Timeline from './AccountProfile/Timeline'
@ -131,7 +129,7 @@ export default {
},
computed: {
...mapState({
theme: (state) => {
theme: state => {
return {
'--theme-mask-color': state.App.theme.wrapper_mask_color,
'--theme-border-color': state.App.theme.border_color,
@ -170,7 +168,7 @@ export default {
noteClick(e) {
const link = findLink(e.target, 'note')
if (link !== null) {
shell.openExternal(link)
window.shell.openExternal(link)
}
},
follow(account) {
@ -203,7 +201,7 @@ export default {
this.activeTab = index
},
openBrowser(account) {
shell.openExternal(account.url)
window.shell.openExternal(account.url)
this.$refs.popper.doClose()
},
addToList(account) {
@ -231,7 +229,7 @@ export default {
metadataClick(e) {
const link = findLink(e.target, 'metadata')
if (link !== null) {
return shell.openExternal(link)
return window.shell.openExternal(link)
}
}
}

5
src/renderer/components/TimelineSpace/Modals/NewToot.vue
View File

@ -130,7 +130,6 @@
<script>
import { mapState, mapGetters } from 'vuex'
import { clipboard } from 'electron'
import Visibility from '~/src/constants/visibility'
import Status from './NewToot/Status'
import Poll from './NewToot/Poll'
@ -295,12 +294,12 @@ export default {
this.updateImage(file)
},
onPaste(e) {
const mimeTypes = clipboard.availableFormats().filter(type => type.startsWith('image'))
const mimeTypes = window.clipboard.availableFormats().filter(type => type.startsWith('image'))
if (mimeTypes.length === 0) {
return
}
e.preventDefault()
const image = clipboard.readImage()
const image = window.clipboard.readImage()
let data
if (/^image\/jpe?g$/.test(mimeTypes[0])) {
data = image.toJPEG(100)

3
src/renderer/components/TimelineSpace/SideMenu.vue
View File

@ -133,7 +133,6 @@
<script>
import { mapState } from 'vuex'
import { shell } from 'electron'
export default {
name: 'side-menu',
@ -178,7 +177,7 @@ export default {
this.$store.dispatch('TimelineSpace/Contents/SideBar/openAccountComponent')
break
case 'edit':
shell.openExternal(this.account.baseURL + '/settings/profile')
window.shell.openExternal(this.account.baseURL + '/settings/profile')
break
case 'settings':
const url = `/${this.id()}/settings`

3
src/renderer/components/organisms/Notification/Favourite.vue
View File

@ -101,7 +101,6 @@
<script>
import { mapState } from 'vuex'
import moment from 'moment'
import { shell } from 'electron'
import { findAccount, findLink, findTag } from '~/src/renderer/utils/tootParser'
import emojify from '~/src/renderer/utils/emojify'
import TimeFormat from '~/src/constants/timeFormat'
@ -209,7 +208,7 @@ export default {
openLink(e) {
const link = findLink(e.target, 'favourite')
if (link !== null) {
return shell.openExternal(link)
return window.shell.openExternal(link)
}
},
openUser(account) {

3
src/renderer/components/organisms/Notification/Reblog.vue
View File

@ -103,7 +103,6 @@
<script>
import { mapState } from 'vuex'
import moment from 'moment'
import { shell } from 'electron'
import { findAccount, findLink, findTag } from '~/src/renderer/utils/tootParser'
import emojify from '~/src/renderer/utils/emojify'
import TimeFormat from '~/src/constants/timeFormat'
@ -209,7 +208,7 @@ export default {
openLink(e) {
const link = findLink(e.target, 'reblog')
if (link !== null) {
return shell.openExternal(link)
return window.shell.openExternal(link)
}
},
openUser(account) {

7
src/renderer/components/organisms/Toot.vue
View File

@ -178,7 +178,6 @@
<script>
import moment from 'moment'
import { shell, clipboard } from 'electron'
import { mapState } from 'vuex'
import { findAccount, findLink, findTag } from '~/src/renderer/utils/tootParser'
import DisplayStyle from '~/src/constants/displayStyle'
@ -391,7 +390,7 @@ export default {
openLink(e) {
const link = findLink(e.target, 'toot')
if (link !== null) {
return shell.openExternal(link)
return window.shell.openExternal(link)
}
},
openReply() {
@ -404,11 +403,11 @@ export default {
this.$refs.popper.doClose()
},
openBrowser(message) {
shell.openExternal(message.url)
window.shell.openExternal(message.url)
this.$refs.popper.doClose()
},
copyLink(message) {
clipboard.writeText(message.url, 'toot-link')
window.clipboard.writeText(message.url, 'toot-link')
this.$refs.popper.doClose()
},
reportUser() {

10
src/renderer/main.ts
View File

@ -16,15 +16,6 @@ import router from '@/router'
import store from './store'
import i18next from '~/src/config/i18n'
declare function require(x: string): any
declare var process: {
env: {
NODE_ENV: string,
IS_WEB: boolean
}
}
Vue.use(ElementUI, { locale })
Vue.use(shortkey)
Vue.use(VueI18Next)
@ -33,7 +24,6 @@ Vue.component('popper', Popper)
sync(store, router)
if (!process.env.IS_WEB) Vue.use(require('vue-electron'))
Vue.config.productionTip = false
const i18n: VueI18Next = new VueI18Next(i18next)

82
src/renderer/router/index.ts
View File

@ -1,6 +1,34 @@
import Vue from 'vue'
import Router from 'vue-router'
import Login from '@/components/Login.vue'
import Authorize from '@/components/Authorize.vue'
import Preferences from '@/components/Preferences.vue'
import PreferencesGeneral from '@/components/Preferences/General.vue'
import PreferencesAppearance from '@/components/Preferences/Appearance.vue'
import PreferencesNotification from '@/components/Preferences/Notification.vue'
import PreferencesAccount from '@/components/Preferences/Account.vue'
import PreferencesLanguage from '@/components/Preferences/Language.vue'
import GlobalHeader from '@/components/GlobalHeader.vue'
import Settings from '@/components/Settings.vue'
import SettingsGeneral from '@/components/Settings/General.vue'
import SettingsTimeline from '@/components/Settings/Timeline.vue'
import TimelineSpace from '@/components/TimelineSpace.vue'
import TimelineSpaceContentsHome from '@/components/TimelineSpace/Contents/Home.vue'
import TimelineSpaceContentsNotifications from '@/components/TimelineSpace/Contents/Notifications.vue'
import TimelineSpaceContentsMentions from '@/components/TimelineSpace/Contents/Mentions.vue'
import TimelineSpaceContentsFavourites from '@/components/TimelineSpace/Contents/Favourites.vue'
import TimelineSpaceContentsLocal from '@/components/TimelineSpace/Contents/Local.vue'
import TimelineSpaceContentsPublic from '@/components/TimelineSpace/Contents/Public.vue'
import TimelineSpaceContentsHashtag from '@/components/TimelineSpace/Contents/Hashtag.vue'
import TimelineSpaceContentsHashtagList from '@/components/TimelineSpace/Contents/Hashtag/List.vue'
import TimelineSpaceContentsHashtagTag from '@/components/TimelineSpace/Contents/Hashtag/Tag.vue'
import TimelineSpaceContentsSearch from '@/components/TimelineSpace/Contents/Search.vue'
import TimelineSpaceContentsDirectMessages from '@/components/TimelineSpace/Contents/DirectMessages.vue'
import TimelineSpaceContentsListsIndex from '@/components/TimelineSpace/Contents/Lists/Index.vue'
import TimelineSpaceContentsListsEdit from '@/components/TimelineSpace/Contents/Lists/Edit.vue'
import TimelineSpaceContentsListsShow from '@/components/TimelineSpace/Contents/Lists/Show.vue'
Vue.use(Router)
const router = new Router({
@ -8,38 +36,38 @@ const router = new Router({
{
path: '/login',
name: 'login',
component: require('@/components/Login').default
component: Login
},
{
path: '/authorize',
name: 'authorize',
component: require('@/components/Authorize').default,
component: Authorize,
props: route => ({ url: route.query.url })
},
{
path: '/preferences/',
name: 'preferences',
component: require('@/components/Preferences').default,
component: Preferences,
children: [
{
path: 'general',
name: 'general',
component: require('@/components/Preferences/General').default
component: PreferencesGeneral
},
{
path: 'appearance',
name: 'appearance',
component: require('@/components/Preferences/Appearance').default
component: PreferencesAppearance
},
{
path: 'notification',
name: 'notification',
component: require('@/components/Preferences/Notification').default
component: PreferencesNotification
},
{
path: 'account',
name: 'account',
component: require('@/components/Preferences/Account').default
component: PreferencesAccount
},
{
path: 'network',
@ -49,48 +77,48 @@ const router = new Router({
{
path: 'language',
name: 'language',
component: require('@/components/Preferences/Language').default
component: PreferencesLanguage
}
]
},
{
path: '/',
name: 'global-header',
component: require('@/components/GlobalHeader').default,
component: GlobalHeader,
children: [
{
path: ':id/settings/',
component: require('@/components/Settings').default,
component: Settings,
children: [
{
path: 'general',
component: require('@/components/Settings/General').default
component: SettingsGeneral
},
{
path: 'timeline',
component: require('@/components/Settings/Timeline').default
component: SettingsTimeline
}
]
},
{
path: ':id/',
name: 'timeline-space',
component: require('@/components/TimelineSpace').default,
component: TimelineSpace,
children: [
{
path: 'home',
name: 'home',
component: require('@/components/TimelineSpace/Contents/Home').default
component: TimelineSpaceContentsHome
},
{
path: 'notifications',
name: 'notifications',
component: require('@/components/TimelineSpace/Contents/Notifications').default
component: TimelineSpaceContentsNotifications
},
{
path: 'mentions',
name: 'mentions',
component: require('@/components/TimelineSpace/Contents/Mentions').default
component: TimelineSpaceContentsMentions
},
{
path: 'follow-requests',
@ -100,31 +128,31 @@ const router = new Router({
{
path: 'favourites',
name: 'favourites',
component: require('@/components/TimelineSpace/Contents/Favourites').default
component: TimelineSpaceContentsFavourites
},
{
path: 'local',
name: 'local',
component: require('@/components/TimelineSpace/Contents/Local').default
component: TimelineSpaceContentsLocal
},
{
path: 'public',
name: 'public',
component: require('@/components/TimelineSpace/Contents/Public').default
component: TimelineSpaceContentsPublic
},
{
path: 'hashtag/',
component: require('@/components/TimelineSpace/Contents/Hashtag').default,
component: TimelineSpaceContentsHashtag,
children: [
{
path: '',
name: 'hashtag-list',
component: require('@/components/TimelineSpace/Contents/Hashtag/List').default
component: TimelineSpaceContentsHashtagList
},
{
path: ':tag',
name: 'tag',
component: require('@/components/TimelineSpace/Contents/Hashtag/Tag').default,
component: TimelineSpaceContentsHashtagTag,
props: true
}
]
@ -132,28 +160,28 @@ const router = new Router({
{
path: 'search',
name: 'search',
component: require('@/components/TimelineSpace/Contents/Search').default
component: TimelineSpaceContentsSearch
},
{
path: 'direct-messages',
name: 'direct-messages',
component: require('@/components/TimelineSpace/Contents/DirectMessages').default
component: TimelineSpaceContentsDirectMessages
},
{
path: 'lists',
name: 'lists',
component: require('@/components/TimelineSpace/Contents/Lists/Index').default
component: TimelineSpaceContentsListsIndex
},
{
path: 'lists/:list_id/edit',
name: 'edit-list',
component: require('@/components/TimelineSpace/Contents/Lists/Edit').default,
component: TimelineSpaceContentsListsEdit,
props: true
},
{
path: 'lists/:list_id',
name: 'list',
component: require('@/components/TimelineSpace/Contents/Lists/Show').default,
component: TimelineSpaceContentsListsShow,
props: true
}
]

22
src/renderer/store/App.ts
View File

@ -1,4 +1,3 @@
import { ipcRenderer } from 'electron'
import { MutationTree, ActionTree, Module } from 'vuex'
import router from '@/router'
import { LightTheme, DarkTheme, SolarizedLightTheme, SolarizedDarkTheme, KimbieDarkTheme, ThemeColorType } from '~/src/constants/themeColor'
@ -12,6 +11,9 @@ import { Notify } from '~/src/types/notify'
import { BaseConfig } from '~/src/types/preference'
import { Appearance } from '~/src/types/appearance'
import { ProxyConfig } from 'megalodon'
import { MyWindow } from '~/src/types/global'
const win = window as MyWindow
export type AppState = {
theme: ThemeColorType
@ -107,22 +109,22 @@ const mutations: MutationTree<AppState> = {
const actions: ActionTree<AppState, RootState> = {
watchShortcutsEvents: () => {
ipcRenderer.on('open-preferences', () => {
win.ipcRenderer.on('open-preferences', () => {
router.push('/preferences/general')
})
},
removeShortcutsEvents: () => {
ipcRenderer.removeAllListeners('open-preferences')
win.ipcRenderer.removeAllListeners('open-preferences')
},
loadPreferences: ({ commit, dispatch }) => {
return new Promise((resolve, reject) => {
ipcRenderer.send('get-preferences')
ipcRenderer.once('error-get-preferences', (_, err: Error) => {
ipcRenderer.removeAllListeners('response-get-preferences')
win.ipcRenderer.send('get-preferences')
win.ipcRenderer.once('error-get-preferences', (_, err: Error) => {
win.ipcRenderer.removeAllListeners('response-get-preferences')
reject(err)
})
ipcRenderer.once('response-get-preferences', (_, conf: BaseConfig) => {
ipcRenderer.removeAllListeners('error-get-preferences')
win.ipcRenderer.once('response-get-preferences', (_, conf: BaseConfig) => {
win.ipcRenderer.removeAllListeners('error-get-preferences')
dispatch('updateTheme', conf.appearance)
commit(MUTATION_TYPES.UPDATE_DISPLAY_NAME_STYLE, conf.appearance.displayNameStyle)
commit(MUTATION_TYPES.UPDATE_FONT_SIZE, conf.appearance.fontSize)
@ -166,11 +168,11 @@ const actions: ActionTree<AppState, RootState> = {
},
loadProxy: ({ commit }) => {
return new Promise(resolve => {
ipcRenderer.once('response-get-proxy-configuration', (_, proxy: ProxyConfig | false) => {
win.ipcRenderer.once('response-get-proxy-configuration', (_, proxy: ProxyConfig | false) => {
commit(MUTATION_TYPES.UPDATE_PROXY_CONFIGURATION, proxy)
resolve(proxy)
})
ipcRenderer.send('get-proxy-configuration')
win.ipcRenderer.send('get-proxy-configuration')
})
}
}

9
src/renderer/store/index.ts
View File

@ -11,10 +11,13 @@ import TimelineSpace, { TimelineSpaceModuleState } from './TimelineSpace'
import Preferences, { PreferencesModuleState } from './Preferences'
import Settings, { SettingsModuleState } from './Settings'
import organisms, { OrganismsModuleState } from './organisms'
import { MyWindow } from '~/src/types/global'
Vue.use(Vuex)
export type RootState = {
const win = window as MyWindow
export interface RootState {
App: AppState
GlobalHeader: GlobalHeaderState
Login: LoginState
@ -27,8 +30,8 @@ export type RootState = {
}
export default new Vuex.Store({
strict: process.env.NODE_ENV !== 'production',
plugins: process.env.NODE_ENV !== 'production' ? [createLogger({})] : [],
strict: win.process.env.NODE_ENV !== 'production',
plugins: win.process.env.NODE_ENV !== 'production' ? [createLogger({})] : [],
modules: {
App,
GlobalHeader,

8
src/types/global.ts Normal file
View File

@ -0,0 +1,8 @@
import { Shell, IpcRenderer, Clipboard } from 'electron'
export interface MyWindow extends Window {
shell: Shell
ipcRenderer: IpcRenderer
clipboard: Clipboard
process: NodeJS.Process
}