Skip to content

Commit

Permalink
feat: emoji v16.0 (#479)
Browse files Browse the repository at this point in the history
  • Loading branch information
nolanlawson authored Dec 7, 2024
1 parent b9ac699 commit 08018ce
Show file tree
Hide file tree
Showing 10 changed files with 60 additions and 23 deletions.
2 changes: 1 addition & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ A lightweight emoji picker, distributed as a web component.

**Features:**

- Supports [Emoji v15.1](https://emojipedia.org/emoji-15.1/) (depending on OS) and custom emoji
- Supports [Emoji v16.0](https://emojipedia.org/emoji-16.0) (depending on OS) and custom emoji
- Uses IndexedDB, so it consumes [far less memory](https://nolanlawson.com/2020/06/28/introducing-emoji-picker-element-a-memory-efficient-emoji-picker-for-the-web/) than other emoji pickers
- [Small bundle size](https://bundlephobia.com/result?p=emoji-picker-element) (~12.5kB min+gz)
- Renders native emoji by default, with support for custom fonts
Expand Down
1 change: 1 addition & 0 deletions bin/versionsAndTestEmoji.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@
// "face without mouth" plus "fog".) These emoji can only be filtered using the width test,
// which happens in checkZwjSupport.js.
export const versionsAndTestEmoji = {
'🫩': 16, // face with bags under eyes
'🫨': 15.1, // shaking head, technically from v15 but see note above
'🫠': 14,
'🥲': 13.1, // smiling face with tear, technically from v13 but see note above
Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -94,7 +94,7 @@
"conventional-changelog-cli": "^5.0.0",
"cross-env": "^7.0.3",
"csso": "^5.0.5",
"emoji-picker-element-data": "^1.6.1",
"emoji-picker-element-data": "^1.7.0",
"emojibase-data": "^5.1.1",
"express": "^4.21.1",
"fake-indexeddb": "^6.0.0",
Expand Down
10 changes: 5 additions & 5 deletions pnpm-lock.yaml

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

5 changes: 3 additions & 2 deletions test/spec/database/Database.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -218,8 +218,9 @@ describe('database tests', () => {
expect(thumbsUp[0].skins[0].unicode).toBeTruthy()
expect(thumbsUp[0].skins[0].version).toBeTruthy()
expect(thumbsUp[0].shortcodes).toContain('thumbsup')
const grinningFace = await db.getEmojiBySearchQuery('grinning face with smiling eyes')
expect(grinningFace[0].emoticon).toEqual(':D')
const grinningFace = (await db.getEmojiBySearchQuery('grinning face with smiling eyes'))
.find(_ => _.unicode === '😄')
expect(grinningFace.emoticon).toEqual(':D')
await db.delete()
})

Expand Down
3 changes: 2 additions & 1 deletion test/spec/database/custom.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -108,7 +108,8 @@ describe('custom emoji', () => {
expect((await db.getEmojiBySearchQuery('monkey')).map(summarize)).toStrictEqual([
{ name: 'monkey', shortcodes: ['monkey'], url: 'monkey.png' },
summaryByUnicode('🐵'),
summaryByUnicode('🐒')
summaryByUnicode('🐒'),
summaryByUnicode('🦧')
])

expect((await db.getEmojiBySearchQuery('undersc'))).toStrictEqual([
Expand Down
12 changes: 8 additions & 4 deletions test/spec/database/getEmojiBySearchQuery.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -53,25 +53,29 @@ describe('getEmojiBySearchQuery', () => {
expectToBeSorted(results)
expect(results.map(_ => omit(_, ['order']))).toStrictEqual([
{ annotation: 'monkey face' },
{ annotation: 'monkey' }
{ annotation: 'monkey' },
{ annotation: 'orangutan' }
])
results = await search('monkey')
expectToBeSorted(results)
expect(results.map(_ => omit(_, ['order']))).toStrictEqual([
{ annotation: 'monkey face' },
{ annotation: 'monkey' }
{ annotation: 'monkey' },
{ annotation: 'orangutan' }
])
results = await search('monkey')
expectToBeSorted(results)
expect(results.map(_ => omit(_, ['order']))).toStrictEqual([
{ annotation: 'monkey face' },
{ annotation: 'monkey' }
{ annotation: 'monkey' },
{ annotation: 'orangutan' }
])
results = await search('MoNkEy')
expectToBeSorted(results)
expect(results.map(_ => omit(_, ['order']))).toStrictEqual([
{ annotation: 'monkey face' },
{ annotation: 'monkey' }
{ annotation: 'monkey' },
{ annotation: 'orangutan' }
])
results = await search('monkey fac')
expect(results.map(_ => omit(_, ['order']))).toStrictEqual([
Expand Down
44 changes: 37 additions & 7 deletions test/spec/picker/Picker.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -71,10 +71,11 @@ describe('Picker tests', () => {
expect(queryAllByRole('tab', { selected: true })).toHaveLength(1) // one tab selected at first
await type(getByRole('combobox'), 'monk')

await waitFor(() => expect(getAllByRole('option')).toHaveLength(2))
await waitFor(() => expect(getAllByRole('option')).toHaveLength(3))

expect(getByRole('option', { name: /🐵/ })).toBeVisible()
expect(getByRole('option', { name: /🐒/ })).toBeVisible()
expect(getByRole('option', { name: /🦧/ })).toBeVisible()
expect(queryAllByRole('tab', { selected: true })).toHaveLength(0) // no tabs selected when searching
})

Expand Down Expand Up @@ -242,7 +243,20 @@ describe('Picker tests', () => {
annotation: 'grinning face',
group: 0,
shortcodes: ['grinning', 'grinning_face'],
tags: ['face', 'grin'],
tags: [
'cheerful',
'cheery',
'face',
'grin',
'grinning',
'happy',
'laugh',
'nice',
'smile',
'smiling',
'teeth'

],
unicode: '😀',
version: 1
},
Expand All @@ -265,7 +279,7 @@ describe('Picker tests', () => {
annotation: 'thumbs up',
group: 1,
shortcodes: ['+1', 'thumbsup', 'yes'],
tags: ['+1', 'hand', 'thumb', 'up'],
tags: ['+1', 'good', 'hand', 'like', 'thumb', 'up', 'yes'],
unicode: '👍️',
version: 0.6,
skins: [
Expand All @@ -289,7 +303,19 @@ describe('Picker tests', () => {
annotation: 'grinning face',
group: 0,
shortcodes: ['grinning', 'grinning_face'],
tags: ['face', 'grin'],
tags: [
'cheerful',
'cheery',
'face',
'grin',
'grinning',
'happy',
'laugh',
'nice',
'smile',
'smiling',
'teeth'
],
unicode: '😀',
version: 1
},
Expand All @@ -300,7 +326,7 @@ describe('Picker tests', () => {

test('press up/down on search input', async () => {
type(getByRole('combobox'), 'monk')
await waitFor(() => expect(getAllByRole('option')).toHaveLength(2))
await waitFor(() => expect(getAllByRole('option')).toHaveLength(3))

const pressKeyAndExpectAriaDescendant = async (key, emoji) => {
await new Promise(resolve => requestAnimationFrame(() => requestAnimationFrame(resolve))) // delay
Expand All @@ -313,8 +339,12 @@ describe('Picker tests', () => {

await pressKeyAndExpectAriaDescendant('ArrowDown', '🐵')
await pressKeyAndExpectAriaDescendant('ArrowDown', '🐒')
await pressKeyAndExpectAriaDescendant('ArrowUp', '🐵')
await pressKeyAndExpectAriaDescendant('ArrowDown', '🦧')
await pressKeyAndExpectAriaDescendant('ArrowDown', '🐵')
await pressKeyAndExpectAriaDescendant('ArrowUp', '🦧')
await pressKeyAndExpectAriaDescendant('ArrowUp', '🐒')
await pressKeyAndExpectAriaDescendant('ArrowUp', '🐵')
await pressKeyAndExpectAriaDescendant('ArrowDown', '🐒')

let emoji
picker.addEventListener('emoji-click', event => {
Expand All @@ -327,7 +357,7 @@ describe('Picker tests', () => {
annotation: 'monkey',
group: 3,
shortcodes: ['monkey'],
tags: ['monkey'],
tags: ['animal', 'banana'],
unicode: '🐒',
version: 0.6
},
Expand Down
2 changes: 1 addition & 1 deletion test/spec/picker/favorites.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -136,7 +136,7 @@ describe('Favorites UI', () => {

test('press down on search input - does not affect favorites', async () => {
type(getByRole(container, 'combobox'), 'monk')
await waitFor(() => expect(getAllByRole(container, 'option')).toHaveLength(2))
await waitFor(() => expect(getAllByRole(container, 'option')).toHaveLength(3))

const pressKeyAndExpectAriaDescendant = async (key, emoji) => {
await new Promise(resolve => requestAnimationFrame(() => requestAnimationFrame(resolve))) // delay
Expand Down
2 changes: 1 addition & 1 deletion test/spec/picker/scrolling.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -69,7 +69,7 @@ describe('scrolling', () => {

await userEvent.type(getByRole(container, 'combobox'), 'monkey')

await waitFor(() => expect(getAllByRole(container, 'option')).toHaveLength(2))
await waitFor(() => expect(getAllByRole(container, 'option')).toHaveLength(3))
expect(getByRole(container, 'option', { name: /🐵/ })).toBeVisible()

await tick(100)
Expand Down

0 comments on commit 08018ce

Please sign in to comment.