サロゲートペアを字数にカウントしないようにする (#2661)

* Update post-form.vue

* Update messaging-message.ts

* Update post-form.vue

* Update note.ts

* Update post-form.vue

refs: https://github.com/syuilo/misskey/pull/2661#issuecomment-419579444

* Update post-form.vue

refs: https://github.com/syuilo/misskey/pull/2661#issuecomment-419579444

* Update messaging-message.ts

refs: https://github.com/syuilo/misskey/pull/2661#issuecomment-419579444

* Update note.ts

refs: https://github.com/syuilo/misskey/pull/2661#issuecomment-419579444

* Update post-form.vue

refs: https://github.com/syuilo/misskey/pull/2661#discussion_r216175581

* Update post-form.vue

* Update post-form.vue

refs: https://github.com/syuilo/misskey/pull/2661#discussion_r216242002

* Update post-form.vue

refs: https://github.com/syuilo/misskey/pull/2661#discussion_r216242105

4 files changed, 18 insertions, 6 deletions

diff --git a/src/client/app/desktop/views/components/post-form.vue b/src/client/app/desktop/views/components/post-form.vue
index fd489283f1..483a51b0ae 100644
--- a/src/client/app/desktop/views/components/post-form.vue
+++ b/src/client/app/desktop/views/components/post-form.vue
@@ -45,7 +45,7 @@
 		<span v-if="visibility === 'specified'">%fa:envelope%</span>
 		<span v-if="visibility === 'private'">%fa:lock%</span>
 	</button>
-	<p class="text-count" :class="{ over: text.length > 1000 }">{{ 1000 - text.length }}</p>
+	<p class="text-count" :class="{ over: this.trimmedLength(text) > 1000 }">{{ 1000 - this.trimmedLength(text) }}</p>
 	<button :class="{ posting }" class="submit" :disabled="!canPost" @click="post">
 		{{ posting ? '%i18n:@posting%' : submitText }}<mk-ellipsis v-if="posting"/>
 	</button>
@@ -63,6 +63,7 @@ import MkVisibilityChooser from '../../../common/views/components/visibility-cho
 import parse from '../../../../../mfm/parse';
 import { host } from '../../../config';
 import { erase } from '../../../../../prelude/array';
+import { length } from 'stringz';
 import parseAcct from '../../../../../misc/acct/parse';
 
 export default Vue.extend({
@@ -147,7 +148,7 @@ export default Vue.extend({
 		canPost(): boolean {
 			return !this.posting &&
 				(1 <= this.text.length || 1 <= this.files.length || this.poll || this.renote) &&
-				(this.text.trim().length <= 1000);
+				(length(this.text.trim()) <= 1000);
 		}
 	},
 
@@ -199,6 +200,10 @@ export default Vue.extend({
 	},
 
 	methods: {
+	  trimmedLength(text: string) {
+			return length(text.trim());
+		},
+
 		addTag(tag: string) {
 			insertTextAtCursor(this.$refs.text, ` #${tag} `);
 		},
diff --git a/src/client/app/mobile/views/components/post-form.vue b/src/client/app/mobile/views/components/post-form.vue
index 7e6a4c38e1..be20b11f14 100644
--- a/src/client/app/mobile/views/components/post-form.vue
+++ b/src/client/app/mobile/views/components/post-form.vue
@@ -4,7 +4,7 @@
 		<header>
 			<button class="cancel" @click="cancel">%fa:times%</button>
 			<div>
-				<span class="text-count" :class="{ over: text.length > 1000 }">{{ 1000 - text.length }}</span>
+				<span class="text-count" :class="{ over: trimmedLength(text) > 1000 }">{{ 1000 - trimmedLength(text) }}</span>
 				<span class="geo" v-if="geo">%fa:map-marker-alt%</span>
 				<button class="submit" :disabled="!canPost" @click="post">{{ submitText }}</button>
 			</div>
@@ -60,6 +60,7 @@ import getFace from '../../../common/scripts/get-face';
 import parse from '../../../../../mfm/parse';
 import { host } from '../../../config';
 import { erase } from '../../../../../prelude/array';
+import { length } from 'stringz';
 import parseAcct from '../../../../../misc/acct/parse';
 
 export default Vue.extend({
@@ -180,6 +181,10 @@ export default Vue.extend({
 	},
 
 	methods: {
+		trimmedLength(text: string) {
+			return length(text.trim());
+		},
+
 		addTag(tag: string) {
 			insertTextAtCursor(this.$refs.text, ` #${tag} `);
 		},
diff --git a/src/models/messaging-message.ts b/src/models/messaging-message.ts
index f46abd506d..d778164de0 100644
--- a/src/models/messaging-message.ts
+++ b/src/models/messaging-message.ts
@@ -4,6 +4,7 @@ import { pack as packUser } from './user';
 import { pack as packFile } from './drive-file';
 import db from '../db/mongodb';
 import MessagingHistory, { deleteMessagingHistory } from './messaging-history';
+import { length } from 'stringz';
 
 const MessagingMessage = db.get<IMessagingMessage>('messagingMessages');
 export default MessagingMessage;
@@ -19,7 +20,7 @@ export interface IMessagingMessage {
 }
 
 export function isValidText(text: string): boolean {
-	return text.length <= 1000 && text.trim() != '';
+	return length(text.trim()) <= 1000 && text.trim() != '';
 }
 
 /**
diff --git a/src/models/note.ts b/src/models/note.ts
index 624bdbdfe8..6530d0b324 100644
--- a/src/models/note.ts
+++ b/src/models/note.ts
@@ -2,6 +2,7 @@ import * as mongo from 'mongodb';
 const deepcopy = require('deepcopy');
 import rap from '@prezzemolo/rap';
 import db from '../db/mongodb';
+import { length } from 'stringz';
 import { IUser, pack as packUser } from './user';
 import { pack as packApp } from './app';
 import PollVote, { deletePollVote } from './poll-vote';
@@ -24,11 +25,11 @@ Note.createIndex({
 export default Note;
 
 export function isValidText(text: string): boolean {
-	return text.length <= 1000 && text.trim() != '';
+	return length(text.trim()) <= 1000 && text.trim() != '';
 }
 
 export function isValidCw(text: string): boolean {
-	return text.length <= 100;
+	return length(text.trim()) <= 100;
 }
 
 export type INote = {