Skip to content
This repository was archived by the owner on Dec 16, 2022. It is now read-only.

Commit 702a3f9

Browse files
authored
Merge pull request #61 from ephetic/feat_anscestor-attributes
Feat anscestor attributes
2 parents 920f786 + ced885a commit 702a3f9

File tree

7 files changed

+117
-49
lines changed

7 files changed

+117
-49
lines changed

package-lock.json

Lines changed: 19 additions & 41 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,7 @@
3232
},
3333
"homepage": "https://github.com/checkly/puppeteer-recorder#readme",
3434
"dependencies": {
35-
"@medv/finder": "^1.1.0",
35+
"@medv/finder": "^1.1.2",
3636
"events": "^3.0.0",
3737
"vue": "^2.5.17",
3838
"vue-clipboard2": "^0.2.1",

src/content-scripts/EventRecorder.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -101,8 +101,8 @@ export default class EventRecorder {
101101
// for these events we cannot generate selectors, which is OK
102102
try {
103103
const optimizedMinLength = (e.target.id) ? 2 : 10 // if the target has an id, use that instead of multiple other selectors
104-
const selector = this._dataAttribute && e.target.hasAttribute && e.target.hasAttribute(this._dataAttribute)
105-
? EventRecorder._formatDataSelector(e.target, this._dataAttribute)
104+
const selector = this._dataAttribute
105+
? finder(e.target, {seedMinLength: 5, optimizedMinLength: optimizedMinLength, attr: (name, _value) => name === this._dataAttribute})
106106
: finder(e.target, {seedMinLength: 5, optimizedMinLength: optimizedMinLength})
107107

108108
const msg = {
Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
import puppeteer from 'puppeteer'
2+
import _ from 'lodash'
3+
import {launchPuppeteerWithExtension, runDist} from '../../__e2e-tests__/helpers'
4+
import { waitForAndGetEvents, cleanEventLog, startServer } from './helpers'
5+
6+
let server
7+
let port
8+
let browser
9+
let page
10+
11+
describe.only('attributes', () => {
12+
beforeAll(async (done) => {
13+
await runDist()
14+
const buildDir = process.env.NODE_ENV === 'production' ? '../../../dist' : '../../../build'
15+
const fixture = './fixtures/attributes.html'
16+
{
17+
const {server: _s, port: _p} = await startServer(buildDir, fixture)
18+
server = _s
19+
port = _p
20+
}
21+
return done()
22+
}, 20000)
23+
24+
afterAll(done => {
25+
server.close(() => {
26+
return done()
27+
})
28+
})
29+
30+
beforeEach(async () => {
31+
browser = await launchPuppeteerWithExtension(puppeteer)
32+
page = await browser.newPage()
33+
await page.goto(`http://localhost:${port}/`)
34+
await cleanEventLog(page)
35+
})
36+
37+
afterEach(async () => {
38+
browser.close()
39+
})
40+
41+
test('it should load the content', async () => {
42+
const content = await page.$('#content-root')
43+
expect(content).toBeTruthy()
44+
})
45+
46+
test('it should use data attributes throughout selector', async () => {
47+
await page.evaluate('window.eventRecorder._dataAttribute = "data-qa"')
48+
await page.click('span')
49+
50+
const event = (await waitForAndGetEvents(page, 1))[0]
51+
expect(event.selector).toEqual('body > #content-root > [data-qa="article-wrapper"] > [data-qa="article-body"] > span')
52+
})
53+
54+
})
Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<title>forms</title>
6+
</head>
7+
<body>
8+
<div id="content-root">
9+
<div data-qa="article-wrapper" class="wrapper">
10+
<h1 data-qa="article-title" class="title">Lorem</h1>
11+
<div data-qa="article-body" class="body">
12+
<span>Read More...</span>
13+
</div>
14+
</div>
15+
</div>
16+
<script src="/build/content-script.js" ></script>
17+
</body>
18+
</html>

src/content-scripts/__tests__/forms.spec.js

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import {launchPuppeteerWithExtension, runDist} from '../../__e2e-tests__/helpers
44
import { waitForAndGetEvents, cleanEventLog, startServer } from './helpers'
55

66
let server
7+
let port
78
let browser
89
let page
910

@@ -12,7 +13,11 @@ describe('forms', () => {
1213
await runDist()
1314
const buildDir = process.env.NODE_ENV === 'production' ? '../../../dist' : '../../../build'
1415
const fixture = './fixtures/forms.html'
15-
server = await startServer(buildDir, fixture)
16+
{
17+
const {server: _s, port: _p} = await startServer(buildDir, fixture)
18+
server = _s
19+
port = _p
20+
}
1621
return done()
1722
}, 20000)
1823

@@ -25,7 +30,7 @@ describe('forms', () => {
2530
beforeEach(async () => {
2631
browser = await launchPuppeteerWithExtension(puppeteer)
2732
page = await browser.newPage()
28-
await page.goto('http://localhost:3000/')
33+
await page.goto(`http://localhost:${port}/`)
2934
await cleanEventLog(page)
3035
})
3136

src/content-scripts/__tests__/helpers.js

Lines changed: 16 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -25,8 +25,21 @@ export const startServer = function (buildDir, file) {
2525
app.get('/', (req, res) => {
2626
res.status(200).sendFile(file, { root: __dirname })
2727
})
28-
const server = app.listen(3000, () => {
29-
return resolve(server)
30-
})
28+
let server
29+
let port
30+
const retry = (e) => {
31+
if(e.code == 'EADDRINUSE') {
32+
setTimeout(() => connect, 1000)
33+
}
34+
}
35+
const connect = () => {
36+
port = 0|(Math.random() * 1000) + 3000
37+
server = app.listen(port)
38+
server.once('error', retry)
39+
server.once('listening', () => {
40+
return resolve({server, port})
41+
})
42+
}
43+
connect()
3144
})
3245
}

0 commit comments

Comments
 (0)