Skip to content

Commit b45ca91

Browse files
crimxcrimx
committed
refactor(dicts): update cobuild result
1 parent cca333b commit b45ca91

4 files changed

Lines changed: 84 additions & 126 deletions

File tree

‎src/components/dictionaries/cobuild/_style.shadow.scss‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1204,6 +1204,23 @@
12041204
font-style: italic;
12051205
}
12061206

1207+
.page .cB-e .credits .author,
1208+
.page .cB-e .credits .title,
1209+
.page .cB-e .credits .year {
1210+
display: inline;
1211+
font-size: 0.8em;
1212+
}
1213+
1214+
.page .cB-e .credits .author,
1215+
.page .cB-e .credits .title {
1216+
font-weight: bold;
1217+
font-style: italic;
1218+
}
1219+
1220+
.page .cB-e .credits .title {
1221+
font-variant: small-caps;
1222+
}
1223+
12071224
.page .cit.type-example .ref.type-def {
12081225
text-decoration: none;
12091226
color: inherit;

‎src/components/dictionaries/cobuild/engine.ts‎

Lines changed: 20 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -156,6 +156,9 @@ async function handleDOM(
156156
.map(({ meta, content: $section }, i) => {
157157
const rawType = getCleanLabel(meta.dataset.typeBlock)
158158
const type = normalizeSectionType(rawType)
159+
const $contentSection = isExamplesSection(rawType)
160+
? cleanupExamplesSection($section)
161+
: $section
159162
const title = getSectionTitle(meta, $section, type)
160163
const num = getCleanLabel(
161164
meta.dataset.numBlock || $section.dataset.numBlock
@@ -200,14 +203,14 @@ async function handleDOM(
200203
}
201204
}
202205

203-
$section
206+
$contentSection
204207
.querySelectorAll<HTMLAnchorElement>('.audio_play_button')
205208
.forEach($speaker => {
206209
$speaker.replaceWith(getStaticSpeaker($speaker.dataset.srcMp3))
207210
})
208211

209212
// so that clicking won't trigger in-panel search
210-
$section
213+
$contentSection
211214
.querySelectorAll<HTMLAnchorElement>('a.type-thesaurus')
212215
.forEach(externalLink)
213216

@@ -217,7 +220,7 @@ async function handleDOM(
217220
type,
218221
title,
219222
num,
220-
content: getInnerHTML(HOST, $section, {
223+
content: getInnerHTML(HOST, $contentSection, {
221224
transform
222225
})
223226
}
@@ -271,6 +274,16 @@ function getAudio($section: HTMLElement): string | undefined {
271274
}
272275
}
273276

277+
function cleanupExamplesSection($section: HTMLElement): HTMLElement {
278+
const $cleanSection = $section.cloneNode(true) as HTMLElement
279+
280+
$cleanSection
281+
.querySelectorAll<HTMLElement>('.cB-h, .ex-info')
282+
.forEach($el => $el.remove())
283+
284+
return $cleanSection
285+
}
286+
274287
function shouldSkipSectionType(type: string): boolean {
275288
const key = getSectionTypeKey(type)
276289
const label = getCleanLabel(type).toLowerCase()
@@ -366,3 +379,7 @@ function isAmericanSection(type: string): boolean {
366379
const key = getSectionTypeKey(type)
367380
return key === 'american' || key === 'aed' || type === 'American'
368381
}
382+
383+
function isExamplesSection(type: string): boolean {
384+
return getSectionTypeKey(type) === 'examples'
385+
}

‎test/specs/components/dictionaries/cobuild/engine.spec.ts‎

Lines changed: 34 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -30,23 +30,45 @@ describe('Dict/COBUILD/engine', () => {
3030
throw new Error('Expected Collins result')
3131
}
3232

33-
expect(audio && audio.uk).toBe('https://example.com/ced.mp3')
34-
expect(result.sections.map(section => section.type)).toEqual([
35-
'COBUILD',
36-
'Collins English Dictionary',
37-
'Penguin Dictionary',
38-
'Examples',
39-
'Retail',
40-
'Idioms',
41-
'Collocations'
42-
])
33+
expect(audio && audio.uk).toBeTruthy()
34+
expect(result.sections.map(section => section.type)).toContain(
35+
'Examples'
36+
)
37+
expect(result.sections.map(section => section.type)).toContain(
38+
'COBUILD'
39+
)
40+
expect(result.sections.map(section => section.type)).toContain(
41+
'Collins English Dictionary'
42+
)
43+
expect(result.sections.map(section => section.type)).toContain(
44+
'Penguin Dictionary'
45+
)
46+
47+
const examples = result.sections.find(
48+
section => section.type === 'Examples'
49+
)!
50+
expect(examples.content).toContain("She'd have")
51+
expect(examples.content).toContain(
52+
'href="https://www.collinsdictionary.com/zh/dictionary/english/trouble"'
53+
)
54+
expect(examples.content).toContain('Jon Cleary')
55+
expect(examples.content).toContain("YESTERDAY'S SHADOW")
56+
expect(examples.content).toContain('2001')
57+
expect(examples.content).not.toContain("Examples of 'love'")
58+
expect(examples.content).not.toContain('包括 的例句')
59+
expect(examples.content).not.toContain(
60+
'These examples have been automatically selected'
61+
)
62+
expect(examples.content).not.toContain('这些示例已被自动选择')
63+
expect(examples.content).not.toContain('report an example sentence')
64+
expect(examples.content).not.toContain('Read more')
4365
expect(
4466
result.sections.find(section => section.type === 'Idioms')!.content
45-
).toContain('pick holes in something')
67+
).toContain('cupboard love')
4668
expect(
4769
result.sections.find(section => section.type === 'Collocations')!
4870
.content
49-
).toContain('pick a favorite')
71+
).toContain('abiding love')
5072
expect(
5173
result.sections.some(section =>
5274
/definition\.title\.type|Video pronunciation|Word lists|Word usage trends|Translations/.test(

‎test/specs/components/dictionaries/cobuild/requests.mock.ts‎

Lines changed: 13 additions & 111 deletions
Original file line numberDiff line numberDiff line change
@@ -1,118 +1,20 @@
11
import { MockRequest } from '@/components/dictionaries/helpers'
22

3-
export const mockSearchTexts = ['test']
4-
5-
const html = `
6-
<div
7-
class="dictentry"
8-
data-type-block="definition.title.type.cobuild"
9-
data-title-block="definition.title.type.cobuild"
10-
data-num-block="1"
11-
>
12-
<span class="pron">
13-
<a class="audio_play_button" data-src-mp3="https://example.com/uk.mp3"></a>
14-
</span>
15-
<div class="def">definition</div>
16-
</div>
17-
<div
18-
class="dictentry"
19-
data-type-block="definition.title.type.ced"
20-
data-title-block=""
21-
data-num-block="2"
22-
>
23-
<span class="pron">
24-
<a class="audio_play_button" data-src-mp3="https://example.com/ced.mp3"></a>
25-
</span>
26-
<div class="def">ced definition</div>
27-
</div>
28-
<div
29-
class="dictentry"
30-
data-type-block="definition.title.type.penguin"
31-
data-title-block=""
32-
data-num-block="3"
33-
>
34-
<div class="def">penguin definition</div>
35-
</div>
36-
<div
37-
class="dictentry"
38-
data-type-block="definition.title.type.examples"
39-
data-title-block=""
40-
data-num-block=""
41-
>
42-
<div class="quote">example sentence</div>
43-
</div>
44-
<div
45-
class="dictentry"
46-
data-type-block="Video pronunciation"
47-
data-title-block=""
48-
data-num-block=""
49-
>
50-
<div class="video">video</div>
51-
</div>
52-
<div
53-
class="dictentry"
54-
data-type-block="Word lists"
55-
data-title-block=""
56-
data-num-block=""
57-
>
58-
<div>word list</div>
59-
</div>
60-
<div
61-
class="dictentry"
62-
data-type-block="definition.title.type.esp_ret"
63-
data-title-block=""
64-
data-num-block=""
65-
>
66-
<div class="def">retail definition</div>
67-
</div>
68-
<div
69-
class="dictentry"
70-
data-type-block="Word usage trends"
71-
data-title-block=""
72-
data-num-block=""
73-
>
74-
<div>trend</div>
75-
</div>
76-
<div
77-
class="dictentry"
78-
data-type-block="Translations of &lt;b&gt;{0}&lt;/b&gt;"
79-
data-title-block=""
80-
data-num-block=""
81-
>
82-
<div>translation</div>
83-
</div>
84-
<div class="entry dictionary cB cB-i">
85-
<div
86-
class="cB-h"
87-
data-type-block="definition.title.type.idioms"
88-
data-title-block=""
89-
data-num-block=""
90-
>
91-
<h2 class="entry_title">More idioms containing <div class="h2_entry">pick</div></h2>
92-
</div>
93-
<div class="asset IdiomList assetlink">
94-
<a class="xr ref">pick holes in something</a>
95-
</div>
96-
</div>
97-
<div class="entry dictionary cB cB-rel-t">
98-
<div
99-
class="cB-h"
100-
data-type-block="definition.title.type.collos"
101-
data-title-block=""
102-
data-num-block=""
103-
>
104-
<h2 class="entry_title">COBUILD Collocations <div class="h2_entry">pick</div></h2>
105-
</div>
106-
<div class="asset ColloList assetlink">
107-
<a class="xr ref">pick a favorite</a>
108-
</div>
109-
</div>
110-
`
3+
export const mockSearchTexts = ['how', 'love']
1114

1125
export const mockRequest: MockRequest = mock => {
113-
mock.onGet(/collinsdictionary\.com.*\/verify/).reply(403)
6+
mock.onGet(/collinsdictionary\.com.*\/verify$/).reply(403)
1147

115-
mock.onGet(/collinsdictionary\.com\/zh/).reply(200, html)
8+
mock.onGet(/collinsdictionary/).reply(info => {
9+
const wordMatch = /[^/]+$/.exec(info.url || '')
10+
if (!wordMatch) {
11+
return [404]
12+
}
11613

117-
mock.onGet(/collinsdictionary/).reply(200, html)
14+
return [
15+
200,
16+
require(`raw-loader!./response/${decodeURIComponent(wordMatch[0])}.html`)
17+
.default
18+
]
19+
})
11820
}

0 commit comments

Comments
 (0)