Skip to content

Commit b41ec60

Browse files
initial commit.
1 parent a3df6e0 commit b41ec60

12 files changed

+7141
-0
lines changed

.gitignore

+4
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
lib
2+
node_modules
3+
.DS_Store
4+
yarn-error.log

Jest.config.js

+189
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,189 @@
1+
// For a detailed explanation regarding each configuration property, visit:
2+
// https://jestjs.io/docs/en/configuration.html
3+
4+
module.exports = {
5+
// All imported modules in your tests should be mocked automatically
6+
// automock: false,
7+
8+
// Stop running tests after `n` failures
9+
// bail: 0,
10+
11+
// Respect "browser" field in package.json when resolving modules
12+
// browser: false,
13+
14+
// The directory where Jest should store its cached dependency information
15+
// cacheDirectory: "/private/var/folders/tb/53999lbx1xl2wg6rjj1nprjc0000gn/T/jest_dx",
16+
17+
// Automatically clear mock calls and instances between every test
18+
clearMocks: true,
19+
20+
// Indicates whether the coverage information should be collected while executing the test
21+
// collectCoverage: false,
22+
23+
// An array of glob patterns indicating a set of files for which coverage information should be collected
24+
// collectCoverageFrom: undefined,
25+
26+
// The directory where Jest should output its coverage files
27+
coverageDirectory: "coverage",
28+
29+
// An array of regexp pattern strings used to skip coverage collection
30+
// coveragePathIgnorePatterns: [
31+
// "/node_modules/"
32+
// ],
33+
34+
// A list of reporter names that Jest uses when writing coverage reports
35+
// coverageReporters: [
36+
// "json",
37+
// "text",
38+
// "lcov",
39+
// "clover"
40+
// ],
41+
42+
// An object that configures minimum threshold enforcement for coverage results
43+
// coverageThreshold: undefined,
44+
45+
// A path to a custom dependency extractor
46+
// dependencyExtractor: undefined,
47+
48+
// Make calling deprecated APIs throw helpful error messages
49+
// errorOnDeprecated: false,
50+
51+
// Force coverage collection from ignored files using an array of glob patterns
52+
// forceCoverageMatch: [],
53+
54+
// A path to a module which exports an async function that is triggered once before all test suites
55+
// globalSetup: undefined,
56+
57+
// A path to a module which exports an async function that is triggered once after all test suites
58+
// globalTeardown: undefined,
59+
60+
// A set of global variables that need to be available in all test environments
61+
// globals: {},
62+
63+
// The maximum amount of workers used to run your tests. Can be specified as % or a number. E.g. maxWorkers: 10% will use 10% of your CPU amount + 1 as the maximum worker number. maxWorkers: 2 will use a maximum of 2 workers.
64+
// maxWorkers: "50%",
65+
66+
// An array of directory names to be searched recursively up from the requiring module's location
67+
// moduleDirectories: [
68+
// "node_modules"
69+
// ],
70+
71+
// An array of file extensions your modules use
72+
// moduleFileExtensions: [
73+
// "js",
74+
// "json",
75+
// "jsx",
76+
// "ts",
77+
// "tsx",
78+
// "node"
79+
// ],
80+
81+
// A map from regular expressions to module names that allow to stub out resources with a single module
82+
// moduleNameMapper: {},
83+
84+
// An array of regexp pattern strings, matched against all module paths before considered 'visible' to the module loader
85+
// modulePathIgnorePatterns: [],
86+
87+
// Activates notifications for test results
88+
// notify: false,
89+
90+
// An enum that specifies notification mode. Requires { notify: true }
91+
// notifyMode: "failure-change",
92+
93+
// A preset that is used as a base for Jest's configuration
94+
preset: 'ts-jest',
95+
96+
// Run tests from one or more projects
97+
// projects: undefined,
98+
99+
// Use this configuration option to add custom reporters to Jest
100+
// reporters: undefined,
101+
102+
// Automatically reset mock state between every test
103+
// resetMocks: false,
104+
105+
// Reset the module registry before running each individual test
106+
// resetModules: false,
107+
108+
// A path to a custom resolver
109+
// resolver: undefined,
110+
111+
// Automatically restore mock state between every test
112+
// restoreMocks: false,
113+
114+
// The root directory that Jest should scan for tests and modules within
115+
// rootDir: undefined,
116+
117+
// A list of paths to directories that Jest should use to search for files in
118+
// roots: [
119+
// "<rootDir>"
120+
// ],
121+
122+
// Allows you to use a custom runner instead of Jest's default test runner
123+
// runner: "jest-runner",
124+
125+
// The paths to modules that run some code to configure or set up the testing environment before each test
126+
// setupFiles: [],
127+
128+
// A list of paths to modules that run some code to configure or set up the testing framework before each test
129+
// setupFilesAfterEnv: [],
130+
131+
// A list of paths to snapshot serializer modules Jest should use for snapshot testing
132+
// snapshotSerializers: [],
133+
134+
// The test environment that will be used for testing
135+
testEnvironment: "node",
136+
137+
// Options that will be passed to the testEnvironment
138+
// testEnvironmentOptions: {},
139+
140+
// Adds a location field to test results
141+
// testLocationInResults: false,
142+
143+
// The glob patterns Jest uses to detect test files
144+
// testMatch: [
145+
// "**/__tests__/**/*.[jt]s?(x)",
146+
// "**/?(*.)+(spec|test).[tj]s?(x)"
147+
// ],
148+
149+
// An array of regexp pattern strings that are matched against all test paths, matched tests are skipped
150+
// testPathIgnorePatterns: [
151+
// "/node_modules/"
152+
// ],
153+
154+
// The regexp pattern or array of patterns that Jest uses to detect test files
155+
// testRegex: [],
156+
157+
// This option allows the use of a custom results processor
158+
// testResultsProcessor: undefined,
159+
160+
// This option allows use of a custom test runner
161+
// testRunner: "jasmine2",
162+
163+
// This option sets the URL for the jsdom environment. It is reflected in properties such as location.href
164+
// testURL: "http://localhost",
165+
166+
// Setting this value to "fake" allows the use of fake timers for functions such as "setTimeout"
167+
// timers: "real",
168+
169+
// A map from regular expressions to paths to transformers
170+
// transform: undefined,
171+
172+
// An array of regexp pattern strings that are matched against all source file paths, matched files will skip transformation
173+
// transformIgnorePatterns: [
174+
// "/node_modules/"
175+
// ],
176+
177+
// An array of regexp pattern strings that are matched against all modules before the module loader will automatically return a mock for them
178+
// unmockedModulePathPatterns: undefined,
179+
180+
// Indicates whether each individual test should be reported during the run
181+
verbose: true,
182+
183+
// An array of regexp patterns that are matched against all source file paths before re-running tests in watch mode
184+
// watchPathIgnorePatterns: [],
185+
186+
// Whether to use watchman for file crawling
187+
// watchman: true,
188+
};
189+

README.md

+2
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
Image uploader
2+

__tests__/ImageUploader.spec.tsx

+81
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,81 @@
1+
import React from 'react'
2+
import TestRenderer from 'react-test-renderer';
3+
import ImageUploader from '../src/ImageUploader'
4+
5+
describe('<ImageUploader />', () => {
6+
const container = <ImageUploader
7+
buttonText={'Choose Image'}
8+
extendedClassNames={{}} // Leave empty object to not use any extenede class names
9+
imgExtension={['.jpg', '.jpeg']}
10+
label={'Max file siz: , valid extensions jpg|jpeg'}
11+
maxFileSize={1}
12+
onChange={() => 123}
13+
onUpload={() => '123'}
14+
singleImage={true}
15+
withLabel={true}
16+
/>
17+
18+
test('Should render component', () => {
19+
const testRenderer = TestRenderer.create(container);
20+
const rootImageUploader = testRenderer.root.findByType(ImageUploader)
21+
const EXPECTED_PROPS = {
22+
buttonText: 'Choose Image',
23+
extendedClassNames: {},
24+
imgExtension: [ '.jpg', '.jpeg' ],
25+
label: 'Max file siz: , valid extensions jpg|jpeg',
26+
maxFileSize: 1,
27+
singleImage: true,
28+
withLabel: true
29+
}
30+
expect(rootImageUploader.props.buttonText).toEqual(EXPECTED_PROPS.buttonText)
31+
expect(rootImageUploader.props.extendedClassNames).toEqual(EXPECTED_PROPS.extendedClassNames)
32+
expect(rootImageUploader.props.imgExtension).toEqual(EXPECTED_PROPS.imgExtension)
33+
expect(rootImageUploader.props.label).toEqual(EXPECTED_PROPS.label)
34+
expect(rootImageUploader.props.maxFileSize).toEqual(EXPECTED_PROPS.maxFileSize)
35+
expect(rootImageUploader.props.singleImage).toEqual(EXPECTED_PROPS.singleImage)
36+
expect(rootImageUploader.props.withLabel).toEqual(EXPECTED_PROPS.withLabel)
37+
38+
expect(rootImageUploader.props.onChange()).toEqual(123)
39+
expect(rootImageUploader.props.onUpload()).toEqual('123')
40+
})
41+
42+
const defaultElementsRendered = [
43+
'FileUploader',
44+
'FileContainer',
45+
'FileContent',
46+
'FileActions',
47+
'ErrorsContainer',
48+
'ChooseFileButton',
49+
'FileInput',
50+
'DefaultPicture',
51+
'UploadPicturesWrapper'
52+
]
53+
54+
const notDefaultElementsRendered = [
55+
'UploadFileButton',
56+
'UploadPictureContainer',
57+
'DeleteImage',
58+
'UploadPicture',
59+
'FileErrorMessage'
60+
]
61+
62+
defaultElementsRendered.forEach((element) => {
63+
test(`Should render ${element} element`, () => {
64+
const testRenderer = TestRenderer.create(container);
65+
const elementRendered = testRenderer.root.findByProps({id: element})
66+
expect(elementRendered).toBeDefined()
67+
})
68+
})
69+
70+
notDefaultElementsRendered.forEach((element) => {
71+
test(`Should not render ${element} from start`, () => {
72+
const testRenderer = TestRenderer.create(container);
73+
try {
74+
testRenderer.root.findByProps({id: element})
75+
expect(true).toBe(false)
76+
} catch (error) {
77+
expect(error.message).toEqual(`No instances found with props: {"id":"${element}"}`)
78+
}
79+
})
80+
})
81+
})

index.d.ts

+36
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
2+
export interface IExtendedClassNames {
3+
chooseFileButton?: string;
4+
defaultPicture?: string;
5+
deleteImage?: string;
6+
errorsContainer?: string;
7+
fileActions?: string;
8+
fileContainer?: string;
9+
fileContent?: string;
10+
fileErrorMessage?: string;
11+
fileInput?: string;
12+
fileLabel?: string;
13+
flipMoveContainer?: string;
14+
fileUploader?: string;
15+
uploadFileButton?: string;
16+
uploadPicture?: string;
17+
uploadPictureContainer?: string;
18+
uploadPicturesWrapper?: string;
19+
}
20+
21+
export interface IImageUploaderProps {
22+
buttonText: string;
23+
extendedClassNames: IExtendedClassNames;
24+
imgExtension: Array<string>;
25+
label: string;
26+
maxFileSize: number;
27+
onChange: (pictures: Array<string>, files: Array<File>) => void;
28+
onUpload: (file: File) => void;
29+
singleImage: boolean;
30+
withLabel: boolean;
31+
}
32+
33+
declare const ImageUploader: (props: IImageUploaderProps) => JSX.Element
34+
35+
declare module 'beanloop-image-uploader' {}
36+
export default ImageUploader;

0 commit comments

Comments
 (0)